1. Trang chủ
  2. » Kiếm hiệp

Bài giảng Phát triển ứng dụng Web – Web Programming: Chương 7 - ThS. Lương Trần Hy Hiến

20 12 0

Đang tải... (xem toàn văn)

Tài liệu hạn chế xem trước, để xem đầy đủ mời bạn chọn Tải xuống

THÔNG TIN TÀI LIỆU

Thông tin cơ bản

Định dạng
Số trang 20
Dung lượng 3,24 MB

Nội dung

• 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

Ngày đăng: 11/03/2021, 13:07

TÀI LIỆU CÙNG NGƯỜI DÙNG

TÀI LIỆU LIÊN QUAN