Giáo trình Công nghệ XML

1.1 Thế giới XML

Hiện nay XML (eXtensible Markup Language) chiếm vị trí rất quan trọng trong

việc chuyển tải, trao đổi dữ liệu và liên lạc giữa các ứng dụng. Điều này càng

được khẳng định khi các hệ điều hành từ WindowsXP trở đi và các hệ điều hành

khác bên trong nó chứa rất nhiều tập tin XML. Hơn nữa khi bộ .Net ra đời càng

làm cho XML trở nên thịnh hành và ngày càng được ứng dụng rộng rãi.

Sử dụng kỹ thuật XML không chỉ có tập đoàn Microsoft mà ngay cả Sun, IBM,

Oracles điều hỗ trợ XML sử dụng nó trong các hệ điều hành và các ứng dụng.

XML là ngôn ngữ xây dựng cấu trúc tài liệu văn bản, dựa theo chuẩn SGML

(Standard Generalized Markup Language: siêu ngôn ngữ có khả năng sinh ngôn

ngữ khác). SGML được phát triển cho việc định cấu trúc và nội dung tài liệu điện

tử, do tổ chức ISO (International Organization for Standards) chuẩn hóa năm

1986.

SGML do IBM đưa ra, song không thể không kể đến những đóng góp của các

công ty khác. XML được W3C (World Wide Web Consortium - tổ chức độc lập

định ra tiêu chuẩn cho trình duyệt Web, máy chủ và ngôn ngữ) phát triển, nhưng

đặc tả XML lại do Netscape, Microsoft và các thành viên của dự án Text

Encoding Initiative

(TEI) xây dựng. Tổ chức W3C XML Special Interest Group có đại diện từ hơn

100 công ty cùng nhiều chuyên gia được mời khác.

Lý do ra đời của XML vì SGML rất rắc rối khó sử dụng và HTML có nhiều

giới hạn nên năm 1996 tổ chức W3C thiết kế XML. XML version 1.0 được định

nghĩa trong hồ sơ February 1998 W3C Recommendation.

Điểm quan trọng của kỹ thuật XML là nó không thuộc riêng về một công ty?

nào, nó là một sản phẩm mà trí tuệ của nó thuộc về cả thế giới, là một tiêu chuẩn

được mọi người công nhận vì được soạn ra bởi W3C (World Wide Web

Consortium).

Bản thân của XML rất đơn giản, nhưng các công cụ chuẩn được định ra để làm

việc với XML như Document Object Model - DOM, XPath, XSL,. thì lại rất

hữu hiệu, và chính các chuẩn này được phát triển không ngừng.

XML cũng giống như HTML đều là ngôn ngữ đánh dấu, nhưng điều cần nói ở

đây là sự ra đời của XML nhằm để khắc phục một số mặt hạn chế của HTML.

HTML và XML đều sử dụng các thẻ nhưng các thẻ của HTML là một bộ dữ

liệu được xây dựng và định nghĩa trước, nghĩa là người lập trình phải tuân thủ

theo các thẻ đã định nghĩa của HTML, hiện HTML có khoản hơn 400 thẻ, để nhớ

hết 400 thẻ này cũng không có gì khó khăn đối với người lập trình web chuyên

nghiệp nhưng thật khó đối với những người không chuyên. Hơn nữa, các thẻ của

HTML không nói lên được mô tả dữ liệu trong đó. Nhưng đối với XML thì hoàn

toàn khác bởi vì tag trong XML là do người lập trình tự định nghĩa và mỗi thẻ là

một mô tả dữ liệu mà người lập trình muốn truyền đạt.

Ngôn ngữ định dạng

Ngôn ngữ định dạng (Markup Language ) là tất cả những gì dùng để mô tả nội

dung một tài liệu, đó là cách mà nội dung của tài liệu được diễn dịch. Tuy nhiên,

ngôn ngữ định dạng chúng ta thường sử dụng trước đây là HTML.

Download

Trang 1

Trang 2

Trang 3

Trang 4

Trang 5

Trang 6

Trang 7

Trang 8

Trang 9

Trang 10

Tải về để xem bản đầy đủ

197 trang xuanhieu 6700

Download

Bạn đang xem 10 trang mẫu của tài liệu "Giáo trình Công nghệ XML", để tải tài liệu gốc về máy hãy click vào nút Download ở trên

Tóm tắt nội dung tài liệu: Giáo trình Công nghệ XML

cách.
Các phần tử trong XHTML phải luôn luôn được đóng.
Các phần tử trong XHTML phải viết dạng chữ thường.
Chương 7. Hiển thị
KHOA CÔNG NGHỆ THÔNG TIN 185
Các phần tử trong XHTML phải có một phần tử gốc.
Các thuộc tính trong XHTML
Tên thuộc tính phải viết dạng chữ thường.
Giá trị thuộc tính phải nằm trong dấu trích dẫn.
Cấm không được đơn giản hóa thuộc tính.
là bắt buộc
Văn bản XHTML phải có phần khai báo XHTML DOCTYPE.
Phải có các phần tử , , và , thuộc tính xmlns trong thẻ
phải xác định không gian xml cho văn bản. Ví dụ dưới đây cho thấy văn bản
XHTML với các thẻ bắt buộc tối thiểu.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"https://quantrimang.com/TR/xhtml1/DTD/xhtml1-transitional.dtd">
Tiêu đề văn bản
nội dung
Phần tử XHTML phải được lồng đúng quy cách
Trong HTML, một số phần tử có thể lồng với nhau không theo đúng quy cách như ví
dụ dưới đây.
Văn bản in đậm và in nghiêng
Nhưng trong XHTML, tất cả các phần tử phải được lồng đúng quy cách, như ví dụ
dưới.
Văn bản in đậm và in nghiêng
Phần tử XHTML phải luôn được đóng
Viết như dưới đây là sai
Đoạn văn 1
Đoạn văn 2
Đúng là phải là thế này:
Đoạn văn 1
Đoạn văn 2
Phần tử rỗng cũng phải được đóng
Chương 7. Hiển thị
KHOA CÔNG NGHỆ THÔNG TIN 186
Như ví dụ dưới đây là không hợp lệ.
Ngắt dòng:
Đường nằm ngang:
Hình ảnh:
Mà phải viết như dưới đây.
Ngắt dòng:
Đường nằm ngang:
Hình ảnh:
Phần tử trong XHTML phải viết bằng chữ thường
Viết như dưới đây là sai.
Đoạn văn
Mà phải viết chữ thường như dưới đây.
Đoạn văn
Tên thuộc tính trong XHTML phải viết bằng chữ thường
Không viết mà phải viết
Giá trị thuộc tính phải nằm trong dấu trích dẫn
Không viết mà phải viết
Không được đơn giản hóa thuộc tính
Sai
Đúng
Sai
Đúng
Cách chuyển đổi từ HTML sang XHTML
Thêm XHTML vào dòng đầu tiên của mỗi trang
Thêm thuộc tính xmlns vào phần tử html của mỗi trang
Đổi tất cả các tên phần tử sang dạng chữ thường
Đóng tất cả các phần tử rỗng
Đổi tất cả tên thuộc tính sang dạng chữ thường
Đặt vào dấu trích dẫn tất cả các giá trị thuộc tính
HTML5
Chương 7. Hiển thị
KHOA CÔNG NGHỆ THÔNG TIN 187
HTML5 là một ngôn ngữ lập trình được phát triển trên nền tảng ngôn ngữ HTML
và quan trọng nhất của World Wide Web (WWW). Nó được sử dụng để thiết kế và
cấu trúc các website, hỗ trợ cho đa phương tiện tối đa nhưng vẫn giúp cho website
thân thiện với mọi người dùng và mọi thiết bị, các chương trình máy tính, trình duyệt
web Vậy nền tảng của HTML5 là gì? Cùng tìm hiểu nhé!
HTML5 là một bước cải tiến vượt trội, dần trở thành công nghệ cốt lõi
Bạn có thể tìm hiểu thêm về WWW (World Wide Web) trong bài viết :”WWW là gì?“
HTML là gì?
HTML5 là ngôn ngữ lập trình cải tiến của HTML
HTML (Hypertext Markup Language) là một nền tảng tương tự như Microsoft Word
giúp người dùng thiết kế thành phần trong website, cấu trúc các trang, chuyên mục
Chương 7. Hiển thị
KHOA CÔNG NGHỆ THÔNG TIN 188
hoặc các thiết kế các ứng dụng Vậy, chức năng chủ yểu của nền tảng này chính là
tạo bố cục và định dạng website.
Sự khác biệt giữa HTML và HTML5
HTML và HTML5 có những điểm khác biệt
HTML5 hỗ trợ cho nhiều ứng dụng hơn: Một số ứng dụng như SVG,
canvas được HTML5 hỗ trợ, nhưng dùng trong HTML thì phải sử dụng thêm
các phương tiện bổ trợ.
Lưu dữ liệu tạm: HTML5 sử dụng web SQL databases, application
cache còn HTML chỉ dùng cache của trình duyệt.
JavaScript chạy trong web browser: HTML5 hỗ trợ hoàn toàn cho JavaScript
chạy trên web browser, còn HTML ở các phiên bản cũ hơn thì không thể thực
hiện được.
SGML: Khác với HTML, HTML5 không dựa trên SGML, nhờ vậy, sản phẩm
lập trình có độ tương thích cao hơn.
Sử dụng MathML và SVG: HTML5 cho phép sử dụng MathML và SVG cho
văn bản, nhưng trong HTML thì không được hỗ trợ.
Các element: HTML5 tích hợp các element mới mẻ và quan trọng như
summary, time, aside, audio, command, data, datalist, details, embed, wbr,
figcaption, figure, footer, header, article, hgroup, bdi, canvas, keygen, mark,
meter, nav, output, progress, rp, rt, ruby, section, source, track, video Bên
cạnh đó, nó cũng được loại bỏ các elements lỗi thời trong HTML như isindex,
noframes, acronym, applet, basefont, dir, font, frame, frameset, big, center,
strike.
Các thẻ đã thay đổi trong HTML5
Chương 7. Hiển thị
KHOA CÔNG NGHỆ THÔNG TIN 189
HTML5 đã cải tiến thêm nhiều thẻ, tăng tiện ích cho lập trình viên và người dùng
Phiên bản HTML5 đã cập nhật rất nhiều thẻ mới cho việc tạo lập các bài viết và đa
phương tiện, điển hình là các thẻ sau:
: Định nghĩa một bài viết hoặc bình luận của người dùng, độc lập với
content của website.
: Đánh dấu nội dung một trang hiện tại.
: Loại bỏ việc định nghĩa id cho tiêu đề và cuối trang.
: Định nghĩa phần menu điều hướng cho website.
: Xác định các thành phần khác nhau trong website.
, : Hỗ trợ người dùng xem clip và nghe nhạc trên website mà
không cần bên thứ ba.
: Xác định một container các plugin tương tác với ứng dụng bên
ngoài.
: Cho phép bạn đồ họa mà không cần ứng dụng hỗ trợ.
Ngoài ra, phiên bản HTML5 đã loại bỏ một số thẻ lỗi thời như: ,
, , , , , , , ,
,
Lịch sử phát triển của HTML5
Chương 7. Hiển thị
KHOA CÔNG NGHỆ THÔNG TIN 190
HTML5 ra đời năm 2012, đánh dấu một cột mốc quan trọng trong ngành công nghệ
thông tin
Năm 1989: “World Wide Web” ra đời nhờ phát minh của Tim Berners-Lee.
Năm 1990: Internet ra đời.
Năm 1991: HTML ra đời, cho đến năm 1998 thì đã được cải tiến từ phiên bản
1 đến phiên bản 4.
Năm 2000: Phiên bản XHTML 1.0 ra đời nhờ tổ chức World Wide Web
Consortium (W3C).
Năm 2004: W3C quyết định đóng cửa các phiên bản của
HTML. WHATWG (Web Hypertext Application Technology Working
Group) mong muốn phát triển HTML, sáng tạo nên ngôn ngữ lập trình mới có
độ tương thích cao với các website đang sử dụng và các phiên bản HTML cũ.
Năm 2008: Nhờ sự ủng hộ từ W3C, phiên bản đầu tiên của HTML5 được phát
hành.
Lợi ích của HTML5 là gì?
Dưới đây là 3 điểm lợi ích lớn nhất của HTML5:
Tương thích với các trang web đang tồn tại
Chuẩn hóa các kỹ thuật không chính thức
Tăng khả năng phục vụ đa phương tiện
Chương 7. Hiển thị
KHOA CÔNG NGHỆ THÔNG TIN 191
HTML5 được khuyên dùng nhờ những ưu điểm vượt trội so với phiên bản cũ
Tương thích với các trang web đang tồn tại
HTML5 không làm các trang web khác trước đây dừng hoạt động. Nó chỉ giúp các
website thêm hiệu quả, tăng hiệu năng. Nó không yêu cầu website phải thay đổi ngay
lập tức nếu gặp các lỗi chính tả, cú pháp. Các website cũ vẫn hoạt động và tương thích
với tiêu chuẩn của HTML5.
Bên cạnh đó, HTML5 hỗ trợ đối với tất cả các phiên bản HTML cũ theo cách thức sau
Hỗ trợ các lập trình viên tránh những thành phần lỗi thời đã bị loại bỏ. Cho
phép kiểm tra các đoạn mã code có thực sự tuân thủ theo tiêu chuẩn HTML5.
Hỗ trợ các hãng phát triển trình duyệt về khả năng tương thích ngược với
các nội dung đã tồn tại trước đây. Như vậy, nội dung viết bởi phiên bản
HTML cũ đều sẽ được xây dựng lại từ đầu và hoàn toàn tương thích với các
trình duyệt hiện tại.
Chuẩn hóa các kỹ thuật không chính thức
HTML5 chuẩn hóa các kỹ thuật không chính thức. Nhưng HTML5 lại được sử dụng
rộng rãi do sự tiện lợi hoặc đơn giản, dễ sử dụng. Đôi khi các kỹ thuật mới khó có thể
được áp dụng vì quá phức tạp hoặc gây khó khăn cho các lập trình viên.
Tăng khả năng phục vụ đa phương tiện
HTML5 tăng khả năng phục vụ đa phương tiện tốt hơn mà không cần phải quá phụ
thuộc vào các bên thứ ba như Adobe Flash Bên cạnh đó, nó còn hỗ trợ các thiết bị di
động, khi mà người dùng càng hướng đến việc truy cập website ở mọi lúc mọi nơi,
trên smartphone hoặc máy tính bảng. Nó giúp cho việc lập trình và sử dụng website,
ứng dụng một cách thuận tiện, dễ dàng và không tốn thời gian.
Ưu điểm của HTML5 là gì
Chúng ta sẽ cùng đến với một số những ưu điểm của HTML5 đối với 2 nhóm đối
tượng là lập trình viên và người dùng:
Ưu điểm của HTML5 đối với lập trình viên
Chương 7. Hiển thị
KHOA CÔNG NGHỆ THÔNG TIN 192
HTML5 luôn được khuyến khích sử dụng đối với các lập trình viên
Không cần phải tạo cookies: Trong các phiên bản trước HTML5, nếu lập trình
viên muốn lưu bất kỳ thông tin nào, họ phải tạo cookies. Tuy nhiên với phiên
bản này, lập trình viên không cần phải tạo cookie.
Có thể tùy chỉnh Data Attributes: Với ngôn ngữ HTML5, data có thể được tùy
chỉnh. Lập trình viên không cần phải tìm hiểu về server hoặc Ajax khi thuê máy
chủ cũng có thể lập trình một website có độ tương thích cao.
Menu Element: Được thêm vào để tăng khả năng tương tác của web.
Tiện lợi khi thiết kế web mobile: HTML5 giúp các lập trình viên dễ dàng thao
tác khi xây dựng hay thiết kế các giao diện web mobile.
Tăng thích tương thích cho ứng dụng web: HTML5 cho phép trình duyệt xử
lý như một nền tảng ứng dụng, giúp lập trình viên nâng cao quyền quản trị hiệu
năng website.
Ưu điểm của HTML5 đối với người dùng cuối
Chương 7. Hiển thị
KHOA CÔNG NGHỆ THÔNG TIN 193
HTML5 mang đến những trải nghiệm tiện lợi với người dùng
Trải nghiệm web trên thiết bị di dộng tốt hơn: HTML5 có thể tăng tương
thích trên các thiết bị di động giúp người dùng tiếp cận website và ứng dụng.
Cung cấp trải nghiệm tốt hơn cho người dùng: HTML5 giúp loại bỏ Adobe
Flash và một số ứng dụng xem hình ảnh, video. Thay vào đó, người dùng có thể
trực tiếp xe hình ảnh, video nhờ các thư viện sẵn có.
Website và ứng dụng thân thiện với người dùng: HTML5 hỗ trợ các lập trình
viên thiết kế web đẹp mắt, chuyên nghiệp. HTML5 vẫn thân thiện với người
dùng và được tải với tốc độ nhanh hơn.
Mối liên hệ giữa HTML5 và CSS3 là gì?
HTML5 và CSS3 là “cặp đôi vàng” trong làng lập trình website
Chương 7. Hiển thị
KHOA CÔNG NGHỆ THÔNG TIN 194
HTML5 mang lại những cải tiến tuyệt vời để lập trình viên. Họ có thể tạo nên các
website thực sự đẹp mắt và đầy tiện ích cho người dùng. HTML5 giống như cơ sở hạ
tầng của website. HTML5 là nền tảng để tạo dựng website. Còn CSS3 chính là công
thức để lập trình nên website. CSS3 hỗ trợ cho ngôn ngữ lập trình để website hoàn
thiện nhất có thể.
7.2 Scalable vector Graphics (SVG)
SVG (Scalable Vector Graphics) là định dạng ảnh vector dùng để thể hiện các đối
tượng đồ họa hai chiều và có hỗ trợ tương tác từ phía người dùng cũng như ảnh động.
Vì là hình ảnh dạng vector nên chúng ta có thể hiển thị, co giãn (scale) thoải mái mà
không làm giảm chất lượng hình ảnh.
SVG thuộc tiêu chuẩn mở và được quản lý bởi tổ chức World Wide Web Consortium,
một tổ chức quản lý nhiều chuẩn khác như HTML, XHTML... Các tập tin có đuôi
".svg" được mặc định hiểu là tập tin SVG. SVG có thể phóng to thu nhỏ mọi kích cỡ
mà không giảm chất lượng hình ảnh. Vì thế, nó được dùng nhiều trong các bản đồ, sơ
đồ.
SVG - định dạng ảnh vector
Điều gì làm cho đồ họa vector trở nên hấp dẫn đến mức rất nhiều công ty lớn trong
ngành công nghệ cũng như hãng phần mềm thiết kế nhảy vào cùng phát triển? Bạn có
thể tưởng tượng rằng trong đồ họa vector, mọi đường thẳng, đường cong, hình tròn,
hình chữ nhật... đều được vẽ ra đều dựa vào các điểm tọa độ. Các điểm này sẽ được
nối với nhau trong không gian hai chiều để tạo nên các hình ảnh thực sự. Bởi vì tọa độ
này chỉ mang tính tương đối so với hệ trục tại thời điểm vẽ nên 1 đơn vị trong đồ họa
vector có thể là 10 pixel, 20 pixel hay 100 pixel.
Ưu điểm của SVG
Kích thước file nhỏ, dễ nén
Hình ảnh SVG, XML, chứa nhiều mảnh lặp đi lặp lại của văn bản, vì vậy chúng rất
thích hợp cho các thuật toán nén lossless dữ liệu. Khi một hình ảnh SVG đã được nén
bằng thuật toán tiêu chuẩn gzip, nó được gọi là một hình ảnh "svgz" và sử dụng phần
mở rộng tên tập tin .svgz tương ứng.
Chương 7. Hiển thị
KHOA CÔNG NGHỆ THÔNG TIN 195
Hiển thị đẹp trên màn hình retina
SVGs giống với tất cả các đồ họa vector, có thể được thu nhỏ đến kích thước bất kỳ
mà không mất đi sự rõ ràng (trừ rất nhỏ). Nói cách khác, bạn có thể phóng to để một
SVG tất cả các bạn muốn và họ sẽ luôn luôn nhìn sắc nét. Vì vậy, bạn không còn phải
tạo ra một phiên bản 2x Retina phiên bản cho logo hình ảnh của bạn.
Ưu điểm của SVG
Có thể làm ảnh động
Sử dụng thẻ SVG để nhúng các hình ảnh trên trang web cho phép chúng ta định dạng
một cách dễ dàng thông qua CSS, giống như cách làm với thẻ HTML thông thường.
Ta có thể thay đổi thuộc tính đối tượng như màu nền, độ mờ đục, vị trí, chiều rộng,...
Ngoài ra, ta cũng có thể thêm các hiệu ứng hình ảnh động ấn tượng bằng cách sử dụng
sự kết hợp của các thư viện JS và CSS.
Hỗ trợ đầy đủ
Sau nhiều năm không tương thích trình duyệt, SVGs cuối cùng đã có thể. Chúng được
hỗ trợ trong tất cả các trình duyệt hiện đại bao gồm IE9. Bạn thậm chí có thể sử dụng
Fallbacks nếu bạn vẫn còn quan tâm đến IE8.
Thời gian tải tốt hơn
SVGs tuyệt vời cho thiết kế web, vì nó có độ phân giải vô hạn và kích thước file rất
nhỏ. Nó có thể được nhúng trực tiếp vào một tài liệu HTML với thẻ svg, do trình duyệt
không cần phải tải về đồ họa. Điều này có nghĩa rằng trang web của bạn sẽ được tải
nhanh hơn!
Nhược điểm của SVG
Chương 7. Hiển thị
KHOA CÔNG NGHỆ THÔNG TIN 196
SVG là ngôn ngữ không được thiết kế để sửa chữa trực tiếp trên mã nguồn. Để tạo ra
các hình ảnh SVG nói chung, cần dùng các công cụ hỗ trợ.
SVG cũng tồn tại một số nhược điểm nhất định
Dù SVG có thể là một lựa chọn cho hình ảnh của các trang mạng trong tương lai
không xa, nó vẫn còn khá mới mẻ và cần sự hỗ trợ từ các trình duyệt mạng. Hiện nay
Firefox đã hỗ trợ tương đối đầy đủ cho SVG, tuy nhiên Internet Explorer 8 và một số
trình duyệt khác cần có plug-in đặt riêng lẻ.
Dùng SVG khi nào?
Tất nhiên không thể dùng SVG trong 100% mọi trường hợp. Nhược điểm của SVG là
giới hạn về độ chi tiết và màu sắc, tất nhiên chúng ta có thể sử dụng SVG để vẽ một
hình ảnh phức tạp, hoặc thực như ảnh chụp, nhưng nếu làm vậy thì performance sẽ rất
tệ.
Nhưng với xu hướng hiện nay, phong cách thiết kế phẳng đang là mốt, những website
với giao diện đơn giản, sử dụng hình ảnh cũng đơn giản, ít chi tiết thì SVG hoàn toàn
có thể phát huy được thế mạnh của mình.
Các công cụ hỗ trợ SVG
Ứng dụng Desktop
Adobe Illustrator (Premium)
CorelDraw (Premium)
Xara (Premium)
InkScape (FREE)
Free Web-based
Method Draw
Mondrian
SVG Edit
Việc dùng hình ảnh dạng vector, mà cụ thể là SVG để tiết kiệm công sức, tăng tốc độ
load trang, giảm dung lượng website đang ngày càng được ưa chuộng.
KHOA CÔNG NGHỆ THÔNG TIN 197
TÀI LIỆU THAM KHẢO
TT Tên tác giả Tên sách – giáo trình NXB Năm XB
1
Joe Fawcett Liam,
R.E. Quin, Danny Ayers
Beginning XML, 5th
Edition
John
Wiley &
Sons, Inc
2012
2 Nguyễn Phương Lan XML nền tảng và ứng dụng
Lao động
– xã hội
2003
3
TS Lê Minh Trung – Hoàng
Thanh
XML cho người mới học Thống kê 2002

File đính kèm:

giao_trinh_cong_nghe_xml.pdf