Hướng dẫn is an html file a dom? - tập tin html có phải là dom không?


Với HTML DOM, JavaScript có thể truy cập và thay đổi tất cả các yếu tố của tài liệu HTML.


HTML DOM (Mô hình đối tượng tài liệu)

Khi một trang web được tải, trình duyệt sẽ tạo một mô hình đối tượng tài liệu của trang.Document Object Model of the page.

Mô hình HTML DOM được xây dựng như một cây của các đối tượng:HTML DOM model is constructed as a tree of Objects:

Cây HTML DOM của các đối tượng

Hướng dẫn is an html file a dom? - tập tin html có phải là dom không?

Với mô hình đối tượng, JavaScript có được tất cả sức mạnh cần thiết để tạo HTML động:

  • JavaScript có thể thay đổi tất cả các phần tử HTML trong trang
  • JavaScript có thể thay đổi tất cả các thuộc tính HTML trong trang
  • JavaScript có thể thay đổi tất cả các kiểu CSS trong trang
  • JavaScript có thể xóa các phần tử và thuộc tính HTML hiện có
  • JavaScript có thể thêm các thành phần và thuộc tính HTML mới
  • JavaScript có thể phản ứng với tất cả các sự kiện HTML hiện có trong trang
  • JavaScript có thể tạo các sự kiện HTML mới trong trang

Những gì bạn sẽ học

Trong các chương tiếp theo của hướng dẫn này, bạn sẽ học được:

  • Cách thay đổi nội dung của các phần tử HTML
  • Cách thay đổi kiểu (CSS) của các phần tử HTML
  • Cách phản ứng với các sự kiện HTML DOM
  • Cách thêm và xóa các phần tử HTML


DOM là gì?

DOM là tiêu chuẩn W3C (World Wide Web Consortium).

DOM định nghĩa một tiêu chuẩn để truy cập tài liệu:

"Mô hình đối tượng tài liệu W3C (DOM) là giao diện trung lập về nền tảng và ngôn ngữ cho phép các chương trình và tập lệnh truy cập động và cập nhật nội dung, cấu trúc và kiểu dáng của tài liệu."

Tiêu chuẩn DOM W3C được tách thành 3 phần khác nhau:

  • Core DOM - Mô hình tiêu chuẩn cho tất cả các loại tài liệu
  • XML DOM - Mô hình tiêu chuẩn cho tài liệu XML
  • HTML DOM - Mô hình tiêu chuẩn cho các tài liệu HTML

HTML DOM là gì?

HTML DOM là một mô hình đối tượng tiêu chuẩn và giao diện lập trình cho HTML. Nó định nghĩa:object model and programming interface for HTML. It defines:

  • Các phần tử HTML dưới dạng đối tượngobjects
  • Các thuộc tính của tất cả các phần tử HTMLproperties of all HTML elements
  • Các phương pháp truy cập tất cả các phần tử HTMLmethods to access all HTML elements
  • Các sự kiện cho tất cả các yếu tố HTMLevents for all HTML elements

Nói cách khác: HTML DOM là một tiêu chuẩn cho cách nhận, thay đổi, thêm hoặc xóa các phần tử HTML. The HTML DOM is a standard for how to get, change, add, or delete HTML elements.




Hướng dẫn is an html file a dom? - tập tin html có phải là dom không?

HTML DOM là một mô hình đối tượng cho HTML. Nó định nghĩa:HTML DOM is an Object Model for HTML. It defines:

  • Các phần tử HTML làm đối tượngobjects
  • Thuộc tính cho tất cả các phần tử HTML for all HTML elements
  • Phương pháp cho tất cả các phần tử HTML for all HTML elements
  • Các sự kiện cho tất cả các yếu tố HTML for all HTML elements


Hướng dẫn is an html file a dom? - tập tin html có phải là dom không?

HTML DOM là API (giao diện lập trình) cho JavaScript:HTML DOM is an API (Programming Interface) for JavaScript:

  • JavaScript có thể thêm/thay đổi/xóa các phần tử HTML
  • JavaScript có thể thêm/thay đổi/xóa các thuộc tính HTML
  • JavaScript có thể thêm/thay đổi/xóa các kiểu CSS
  • JavaScript có thể phản ứng với các sự kiện HTML
  • JavaScript có thể thêm/thay đổi/xóa các sự kiện HTML


HTML DOM (Mô hình đối tượng tài liệu)

Khi một trang web được tải, trình duyệt sẽ tạo một mô hình đối tượng tài liệu của trang.Document Object Model of the page.

Mô hình HTML DOM được xây dựng như một cây của các đối tượng:HTML DOM model is constructed as a tree of Objects:

Cây HTML DOM của các đối tượng

Hướng dẫn is an html file a dom? - tập tin html có phải là dom không?


Tìm các yếu tố HTML

Khi bạn muốn truy cập các phần tử HTML với JavaScript, bạn phải tìm các phần tử trước.

Có một vài cách để làm điều này:

  • Tìm các phần tử HTML bằng ID
  • Tìm các phần tử HTML theo tên thẻ
  • Tìm các phần tử HTML theo tên lớp
  • Tìm các phần tử HTML của bộ chọn CSS
  • Tìm các phần tử HTML bằng bộ sưu tập đối tượng HTML

Tìm phần tử HTML bằng ID

Cách dễ nhất để tìm một phần tử HTML trong DOM, là bằng cách sử dụng ID phần tử.

Ví dụ này tìm phần tử với id = "intro":

Nếu phần tử được tìm thấy, phương thức sẽ trả về phần tử dưới dạng đối tượng (trong myelement).

Nếu phần tử không được tìm thấy, myelement sẽ chứa null.


Tìm các phần tử HTML theo tên thẻ

Ví dụ này tìm thấy tất cả các yếu tố:

Ví dụ này tìm ra phần tử có id = "chính", và sau đó tìm tất cả các phần tử bên trong "chính":

Thí dụ

var x = document.getEuityById ("main"); var y = x.getElementsByTagName ("p");
var y = x.getElementsByTagName("p");

Hãy tự mình thử »



Tìm các phần tử HTML theo tên lớp

Nếu bạn muốn tìm tất cả các phần tử HTML có cùng tên lớp, hãy sử dụng getElsementsByClassName ().

Ví dụ này trả về một danh sách tất cả các yếu tố có lớp = "giới thiệu".

Tìm các yếu tố theo tên lớp không hoạt động trong Internet Explorer 8 trở lên.


Tìm các phần tử HTML của bộ chọn CSS

Nếu bạn muốn tìm tất cả các phần tử HTML khớp với bộ chọn CSS được chỉ định (ID, tên lớp, loại, thuộc tính, giá trị của thuộc tính, v.v.), hãy sử dụng phương thức QuerySelectorall ().

Ví dụ này trả về một danh sách tất cả các yếu tố có lớp = "giới thiệu".

Phương thức QuerySelectorall () không hoạt động trong các phiên bản Internet Explorer 8 trở lên.


Tìm các phần tử HTML bằng bộ sưu tập đối tượng HTML

Bộ sưu tập đối tượng HTML cũng có thể truy cập được:

  • document.anchors
  • document.forms
  • document.images
  • document.links
  • document.scripts

Hướng dẫn HTML DOM


Hướng dẫn đầy đủ HTMLDOM

Đây là một giới thiệu ngắn về HTMLDOM.

Đối với một hướng dẫn HTMLDOM đầy đủ, hãy truy cập hướng dẫn của W3Schools HTMLDOM.



Là DOM HTML hay JavaScript?

HTML DOM là một mô hình đối tượng tiêu chuẩn và giao diện lập trình cho HTML. Nó định nghĩa: các phần tử HTML là đối tượng. Các thuộc tính của tất cả các yếu tố HTML.HTML DOM is a standard object model and programming interface for HTML. It defines: The HTML elements as objects. The properties of all HTML elements.

DOM liên quan đến HTML như thế nào?

DOM là viết tắt của mô hình đối tượng tài liệu.Trong thế giới của Web, tất cả các trang web HTML được gọi là tài liệu.Mô hình đối tượng tài liệu đại diện cho từng trang web này trong cấu trúc giống như cây để giúp truy cập và quản lý các yếu tố dễ dàng hơn.. In the world of web, all HTML webpages are referred to as documents. The Document Object Model represents each of these web pages in a tree-like structure to make it easier to access and manage the elements.

Ý nghĩa của DOM trong HTML là gì?

DOM là gì?Mô hình đối tượng tài liệu (DOM) là giao diện lập trình cho các tài liệu web.Nó đại diện cho trang để các chương trình có thể thay đổi cấu trúc tài liệu, kiểu dáng và nội dung.DOM đại diện cho tài liệu là các nút và đối tượng;Bằng cách đó, ngôn ngữ lập trình có thể tương tác với trang.a programming interface for web documents. It represents the page so that programs can change the document structure, style, and content. The DOM represents the document as nodes and objects; that way, programming languages can interact with the page.

Ví dụ DOM là gì?

Một ví dụ về thao tác DOM bằng cách sử dụng ecmascript sẽ là: // truy cập phần tử tbody từ phần tử bảng var mytbodyEuity = myTableLement.firstChild;// Truy cập phần tử TR thứ hai của nó // Danh sách trẻ em bắt đầu ở 0 (và không phải 1).access the tbody element from the table element var myTbodyElement = myTableElement. firstChild; // access its second tr element // The list of children starts at 0 (and not 1).