JavaScript HTML DOM tài liệu

Đối tượng Document của HTML DOM là chủ sở hữu của tất cả các phần tử khác trong trang web của bạn.

Đối tượng Document của HTML DOM

Đối tượng tài liệu đại diện cho trang web của bạn.

Nếu bạn muốn truy cập bất kỳ phần tử nào trong trang HTML, bạn luôn bắt đầu từ việc truy cập đối tượng document.

Dưới đây là một số ví dụ về cách sử dụng đối tượng document để truy cập và thao tác HTML.

Tìm kiếm phần tử HTML

Phương thức Mô tả
document.getElementById(id) Tìm kiếm phần tử thông qua id của phần tử
document.getElementsByTagName(Tên) Tìm kiếm phần tử thông qua tên thẻ
document.getElementsByClassName(Tên) Tìm kiếm phần tử thông qua tên lớp

Thay đổi phần tử HTML

Phương thức Mô tả
element.innerHTML = Nội dung HTML mới Thay đổi inner HTML của phần tử
element.attribute = new value Thay đổi giá trị thuộc tính của phần tử HTML
element.setAttribute(thuộc tính, value) Thay đổi giá trị thuộc tính của phần tử HTML
element.style.property = new style Thay đổi phong cách của phần tử HTML

Thêm và xóa phần tử

Phương thức Mô tả
document.createElement(element) Tạo phần tử HTML
document.removeChild(element) Xóa phần tử HTML
document.appendChild(element) Thêm phần tử HTML
document.replaceChild(element) Thay thế phần tử HTML
document.write(text) Ghi vào luồng đầu ra HTML

Thêm trình xử lý sự kiện

Phương thức Mô tả
document.getElementById(id).onclick = function(){code} Thêm trình xử lý sự kiện cho sự kiện onclick

Tìm kiếm đối tượng HTML

HTML DOM Level 1 đầu tiên (1998), đã định nghĩa 11 đối tượng HTML, bộ sưu tập đối tượng và thuộc tính. Chúng vẫn hiệu lực trong HTML5.

Sau đó, trong HTML DOM Level 3, đã thêm nhiều đối tượng, bộ sưu tập và thuộc tính hơn.

Thuộc tính Mô tả DOM
document.anchors Trả về tất cả các phần tử <a> có thuộc tính name. 1
document.applets Trả về tất cả các phần tử <applet>(HTML5 không khuyến khích sử dụng) 1
document.baseURI Trả về URI cơ sở tuyệt đối của tài liệu 3
document.body Trả về phần tử <body> 1
document.cookie Trả về cookie của tài liệu 1
document.doctype Trả về doctype của tài liệu 3
document.documentElement Trả về phần tử <html> 3
document.documentMode Trả về chế độ sử dụng của trình duyệt 3
document.documentURI Trả về URI của tài liệu 3
document.domain Trả về tên miền của máy chủ tài liệu 1
document.domConfig Đã bỏTrả về cấu hình DOM 3
document.embeds Trả về tất cả các phần tử <embed> 3
document.forms Trả về tất cả các phần tử <form> 1
document.head Trả về phần tử <head> 3
document.images Trả về tất cả các phần tử <img> 1
document.implementation Trả về thực hiện DOM 3
document.inputEncoding Trả về mã hóa (bộ ký tự) của tài liệu 3
document.lastModified Trả về ngày và giờ cập nhật tài liệu 3
document.links Trả về tất cả các phần tử <area> và <a> có thuộc tính href 1
document.readyState Trả về trạng thái (đang tải) của tài liệu 3
document.referrer Trả về URI được tham chiếu (tài liệu liên kết) 1
document.scripts Trả về tất cả các phần tử <script> 3
document.strictErrorChecking Trả về việc có kiểm tra lỗi cưỡng bức hay không 3
document.title Trả về phần tử <title> 1
document.URL Trả về URL đầy đủ của tài liệu 1