Hướng dẫn html5 to xml

I. HTML5 là gì

- HTML5 là phiên bản mới nhất của HTML hiện nay. HTML5 vẫn sẽ giữ lại những đặc điểm cơ bản của HTML4 và bổ sung thêm các đặc tả nổi trội của XHTML, DOM cấp 2, đặc biệt là JavaScript.

- HTML5 được xây dựng dựa trên các nguyên tắc:

  • Ít phụ thuộc vào plugin chức năng.
  • Script nên được thay thế bằng markup bất cứ khi nào có thể.
  • Tính độc lập của thiết bị [nghĩa là có sẵn trên tất cả các thiết bị và cung cấp trải nghiệm kết thúc tương tự].
  • Quá trình phát triển công cộng để mọi người có thể nhìn thấy những gì đang diễn ra.

HTML5 đã bổ sung thêm rất nhiều các thẻ đánh dấu [markup] mới:

  • Các thẻ giúp bạn tách biệt các phần trên và dưới của các block nội dung. Để có thể sử dụng nhiều lần trên một trang duy nhất. 
  • Thẻ
    giúp xác định một phần nội dung cụ thể, ví dụ bình luận của người xem.
  • Thẻ để xác định những phần nào được coi là khối điều hướng.
  • Thẻ 
     cho phép xác định mục chung của nội dung, tương tự như thẻ p đang tồn tại.
  • Thẻ dùng để đánh dấu các nội dung âm thanh và video
  • Thẻ  cho phép bạn vẽ đồ họa bằng cách sử dụng script ngôn ngữ riêng.
  • Thẻ  dùng để nhúng các nội dung hoặc các ứng dụng bên ngoài vào trang web.

HTML5 cũng bỏ đi một số thẻ như , , , , , , và một số thẻ khác.

- Các thẻ đặc biệt DIV, LABEL, SPAN, CANVAS ...... được bổ sung vào phiên bản mới, những thẻ này không có tác dụng trong việc trình bày dữ liệu, không tác động vào dữ liệu mà nó chỉ có tác dụng chứa dữ liệu. Nói cách khác là chúng tạo cấu trúc cho dữ liệu còn việc trình bày dữ liệu ra sao thì đã có CSS để định dạng. 

- HTML5 đã khắc phục được những vấn đề tội tệ nhất trong HTML4. Các trang web sẽ có chuẩn web tốt hơn, dẫn đến nội dung và hiệu suất được cải thiện. Từ khi HTML5 được được phổ biến trên thế giới thì các trang web đã được tải nhanh hơn, chiếm dụng ít băng thông hơn và tuổi thọ pin thiết bị được kéo dài hơn. 

II. XML là gì

- XML là viết tắt của từ eXtensible Markup Language, nghĩa là ngôn ngữ đánh dấu mở rộng, do W3C đề nghị để tạo ra các ngôn ngữ đánh dấu khác. Đây là một tập con đơn giản của SGML, có khả năng mô tả nhiều loại dữ liệu khác nhau. Mục đích chính của XML là đơn giản hóa việc chia sẻ dữ liệu giữa các hệ thống khác nhau, đặc biệt là các hệ thống được kết nối với Internet. Ví dụ bạn xây dựng một ứng dụng bằng C# và một ứng dụng bằng Python thì 2 ngôn ngữ này không hiểu được nhau, vậy cần có XML để trao đổi dữ liệu. 

- File XML có dạng .xml

XML được xây dựng dựa vào cấu trúc NODE lồng nhau, mỗi node sẽ có một thẻ mở và một thẻ đóng như sau: nội dung

Ví dụ: quantrimaytinh.com

- Trên đầu mỗi file XML bạn khai báo phiên bản đang sử dụng

Ví dụ:

III. DOM là gì

1. Khái niệm

- DOM là viết tắt của từ Document Object Model, tạm dịch là mô hình đối tượng các tài liệu trong HTML

- DOM biến các thẻ trong HTML thành các đối tượng khác nhau, qua đó chúng ta có thể tương tác với nó bằng JavaScript

- Như các bạn đã biết Javascript là một ngôn ngữ được sử dụng trong các trình duyệt Browser nên nó đóng một vai trò rất quan trọng trong các ứng dụng trên website. JavaScript có nhiệm vụ thao tác với các tài liệu HTML, để thao tác được thì nó phải thông qua cơ chế DOM

2. Cách xác định DOM trong tài liệu HTML

- Xác định bằng tên thẻ như p, b, img .....
- Xác định bằng thuộc tính id="..."
- Xác định bằng thuộc tính class="..."
- Xác định bằng sự kết hợp của 3 cách trên.

3. Danh sách chia nhóm DOM

- DOM document: có nhiệm vụ lưu trữ toàn bộ các thành phần trong tài liệu của website

- DOM element: có nhiệm vụ truy xuất tới thẻ HTML nào đó thông qua các thuộc tính như tên class, id, ...

- DOM HTML: có nhiệm vụ thay đổi giá trị nội dung và giá trị thuộc tính của các thẻ HTML

- DOM CSS: có nhiệm vụ thay đổi các định dạng CSS của thẻ HTML

- DOM Event: có nhiệm vụ gán các sự kiện vào các thẻ HTML

- DOM Listener: có nhiệm vụ lắng nghe các sự kiện tác động lên thẻ HTML đó

- DOM Navigation dùng để quản lý, thao tác với các thẻ HTML, thể hiện mối quan hệ cha/mẹ - con của các thẻ HTML

- DOM Node, Nodelist: có nhiệm vụ thao tác với HTML thông qua đối tượng [Object]

4. Mô hình về DOM 

- Các bạn hãy hiểu mỗi một thẻ này được gọi là NODE. Thẻ nào chứa thẻ khác thì gọi là PARENT NODE, thẻ được chứa bên trong gọi là CHILD NODE. Rất dễ hiểu đúng không, giống như thư mục mẹ và thư mục con trong hệ điều hành thôi mà.

Chủ Đề