Hỏi đáp

Html Dom Là Gì ? Những Loại Dom Trong Javascript Những Khái Niệm Cơ Bạn dạng Về Dom – viettingame

Với lập trình web, kỹ năng và kiến thức về DOM và thời gian làm việc thao tác DOM là hai yếu hèn tố quan trọng nhất. DOM cho chính mình thời gian làm việc thay đổi mọi thứ của website, lúc mà mọi nội dung đều mà thậm chí được thêm bớt xóa sửa để mang lại trải nghiệm và nội dung tốt nhất.

Đang xem: Html dom là gì

Và Javascript là một từ ngữ được sử dụng trên những Browser nên nó đóng trách nhiệp một vai trò quan trọng trong những website. Javascript giúp cho việc thao tác với những tài liệu HTML kết phù hợp với những cú pháp riêng của nó để tạo thành những trải nghiệm thân thiện của web. Để thao tác được với những thẻ HTML thì nó phải trải qua một công thức ta gọi là DOM.

DOM là gì?

DOM là tên thường gọi viết tắt của (Document Object Model – tạm dịch Quy mô Những Đối tượng người dùng Tài liệu). Là một chuẩn chỉnh được định nghĩa bởi W3C (Tổ Chức Web Toàn Cầu – World Wide Web Consortium). DOM được sử dụng để truy xuất và thao tác trên những tài liệu với cấu trúc dạng HTML hay XML bằng những từ ngữ lập trình thông dụng như Javascript, PHP…

*
*
*
*
*

Những loại DOM trong Javascript

Javascript cung ứng cho chúng ta nhiều loại DOM để xử lí HTML và CSS dễ dàng và đơn giản hơn.

DOM document: lưu trữ toàn bộ những thành phần trong documents của website.DOM element: truy xuất tới thẻ HTML nào khác trải qua những thuộc tính như tên class, id, name của thẻ HTML.DOM HTML: thay đổi giá trị nội dung và giá trị thuộc tính của những thẻ HTML.DOM CSS: thay đổi những định dạng CSS của thẻ HTML.DOM Sự kiện: gán những sự khiếu nại như onclick(), onload() vào những thẻ HTML.DOM Listener: lắng nghe những sự khiếu nại tác động lên thẻ HTML.DOM Navigation sử dụng để quản lý và vận hành, thao tác với những thẻ HTML, thể hiện mối quan hệ phụ vương – con của những thẻ HTMLDOM Node, Nodelist: thao tác với HTML trải qua đối tượng người tiêu dùng (Object).

Thao tác với DOM

Mọi nội dung đều mà thậm chí được update động trải qua những thuộc tính và phương thức của DOM. Từ thay đổi định dạng chữ, nội dung chữ tới thay đổi cấu trúc những node và cả thêm node mới. Chúng ta cần làm rõ cách thao tác DOM và ý nghĩa của từng thuộc tính, phương thức.

Những Thuộc tính và Phương thức thường gặp gỡ

Thuộc tính:id: Định danh – là duy nhất cho từng thực thể nên thường được sử dụng để truy xuất DOM trực tiếp và nhanh gọn lẹ.className: Tên lớp – Cũng sử dụng để truy xuất trực tiếp như id, nhưng 1 className mà thậm chí sử dụng cho nhiều thực thể.tagName: Tên thẻ HTML.innerHTML: Trả về mã HTML bên trong thực thể hiện tại. Đoạn mã HTML này là chuỗi kí tự chứa toàn bộ thực thể bên trong, bao hàm những node thực thể và node văn bạn dạng.

Xem thêm: Tải về trò chơi Titan Đại Chiến Titan trò chơi Trực tuyến, Titan Đại Chiến

outerHTML: Trả về mã HTML của thực thể hiện tại. Nói cách khác, outerHTML = tagName + innerHTML.textContent: Trả về 1 chuỗi kí tự chứa nội dung của toàn bộ node văn bạn dạng bên trong thực thể hiện tại.attributes: Tập những thuộc tính như id, name, class, href, title…style: Tập những định dạng của thực thể hiện tạivalue: Lấy giá trị của thành phần được tìm thành một biến.Phương thức:getElementById(id): Tham chiếu tới 1 node duy nhất với thuộc tính id giống với id cần tìm.getElementsByTagName(tagname): Tham chiếu tới toàn bộ những node với thuộc tính tagName giống với tên thẻ cần tìm, hay hiểu giản dị và đơn giản hơn là tìm toàn bộ những thực thể DOM mang thẻ HTML cùng loại. Nếu muốn truy xuất tới toàn bộ thẻ trong tài liệu HTML thì hãy sử dụng document.getElementsByTagName(“*”).getElementsByName(name): Tham chiếu tới toàn bộ những node với thuộc tính name cần tìm.getAttribute(attributeName): Lấy giá trị của thuộc tính.setAttribute(attributeName, value): Sửa giá trị của thuộc tính.appendChild(node): Thêm một node con vào node hiện tại.

Xem thêm: Tại Sao Địa Chỉ Ip Loopback Là Gì, Điều Khác Biệt Giữa 127

removeChild(node): Xóa 1 node con khỏi node hiện tại.

Mặt khác, những thực thể DOM đều là những node trên cây cấu trúc DOM. Chúng sở hữu thêm những thuộc tính quan hệ để biểu diễn sự phụ thuộc giữa những node với nhau. Nhờ những thuộc tính quan hệ này, chúng ta mà thậm chí truy xuất DOM gián tiếp dựa trên quan hệ và vị trí của những thực thể:

Thuộc tính quan hệ:parentNode: node phụ vươngchildNodes: Những node confirstChild: node con trước hếtlastChild: node con sau cùngnextSibling: node bằng hữu liền kề saupreviousSibling: node bằng hữu liền kề trước

Chúng ta mà thậm chí xem danh sách tương đối đầy đủ ở W3SCHOOLS

Truy xuất những thực thể trong quy mô DOM

Chúng ta mà thậm chí truy xuất mọi thực thể html bằng phương pháp sử dụng những phương thức :

document.getElementById()document.getElementsByTagName()document.getElementsByClass()

Ví dụ:

Về Viettingame.com

Viettingame.com - Chuyên trang web tổng hợp những thông tin hữu ích trên internet như thông tin về game, tin tổng hợp
Xem tất cả các bài viết của Viettingame.com →

Trả lời

Email của bạn sẽ không được hiển thị công khai. Các trường bắt buộc được đánh dấu *