• DOM định nghĩa một cách để truy xuất và điều khiển các thành phần trong 1 trang web... Tổng quan về DOM – HTML..[r]
(1)Javascript - DOM
(2)Nội dung
1 Tổng quan DOM – HTML
2 Một số đối tượng
3 Làm việc với document - DOM
4 Xử lý kiện (event)
(3)1 Tổng quan DOM – HTML
• HTML DOM = HTML Document Object Model
• Xem trang web gồm nhiều nút (node)
• Mỗi nút thành phần (tag HTML, thuộc tính, nội dung tag)
(4)(5)(6)(7)1 Tổng quan DOM – HTML
• Mỗi đối tượng DOM có danh sách thuộc tính (Properties) danh sách phương thức (Method) tương ứng
• objectName.propertyName= value • Vídụ: document.bgColor= “blue”;
(8)(9)2.1 DOM - window
• Là thể đối tượng cửa sổ trình duyệt
• Tồn mở tài liệu HTML
• Sử dụng để truy cập thơng tin window
• Điều khiển kiện xảy window
(10)(11)2.2 DOM - location
(12)2.3 DOM - history
Cung cấp danh sách URL
(13)2.4 DOM - navigator
(14)2.5 DOM - document
• Biểu diễn cho toàn thành phần tài liệu HTML
(15)(16)2.6 DOM – image
• Truy xuất đến tag <img> trang web • Có thể truy xuất thơng qua:
– document.images[index]
– document.images[“ImageName”] – document.ImageName
• Một số thuộc tính Image Obj
– alt, border, classname, title,
(17)2.7 DOM – form
• Dùng để truy xuất đến tag <form> trang web • Có thể truy xuất thơng qua
– document.forms[index]
– document.forms[“FormName”]
– document.FormName
• Một số thuộc tính
– action, method, id, name, target
– classname, title, language, dir
– elements[ ]
(18)2.8 DOM – element
• Tương ứng với form field • Cách truy xuất
document.formName.controlName
<form name=“searchForm” action=“xuly.php”>
<input type=“text” name=“entry”>
<input type=“submit” name=“sender” value=“Search”>
</form>
-document.searchForm.entry
document.searchForm.elements[0]
(19)3 Làm việc với document - DOM
(20)3 Làm việc với document - DOM