Mô hình Dom

Đối tượng – Mô hình đối tượng:  Mỗi thành phần trên trang web được xem như một đối tượng, Tất cả các đối tượng trong Javascript được tổ chức phân cấp dạng hình cây gọi là mô hình DOM (Document Object Model), Ở mức trên cùng là đối tượng window biểu thị cho khung hay cửa sổ của trình duyệt, các phần tử còn lại là đối tượng con của window 
Nội dung trích xuất từ tài liệu:
Mô hình DomCHƯƠNG XVII MÔ HÌNH ĐỐI TƯỢNGI. MÔ HÌNH DOM ((Document Object Model) 1. Đối tượng – Mô hình đối tượng:  Mỗi thành phần trên trang web được xem như một đối tượng, Tất cả các đối tượng trong Javascript được tổ chức phân cấp dạng hình cây gọi là mô hình DOM (Document Object Model), Ở mức trên cùng là đối tượng window biểu thị cho khung hay cửa sổ của trình duyệt, các phần tử còn lại là đối tượng con của window  Để truy xuất đến một đối tượng trong IE và thay đổi dữ liệu cho chính phần tử đó dùng thuộc tính ID , tất cả các đối tượng trên trang đều có một ID duy nhất. windowdocument event frame history location navigator screen document anchor image applet layer form class link element plug-in embedReset submit stylebutton IDcheck box tagselecthiddenpasswordtextradiotextarea2. Mục đích của mô hình DOM: Để định nghĩa 1 tổ chức phân cấp thể hiện các phần của 1 hồ sơ web. Cho phép thay đổi cấu trúc đó thông qua việc thêm bớt nội dung Cung cấp cách thức quan sát, thao tác các đặc tính của nội dung trên trang web Cung cấp thông tin về cách tương tác giữa các mục trên trang web với người dùng Nó cho phép thông báo các sự kiện gây ra do chuột và bàn phím Muốn truy cập vào 1 đối tượng thì phải truy cập vào đối tượng chứa nó trước, dùng dấu chấm (.) để phân cách giữa các đối tượng. Tuy nhiên ta có thể bỏ qua đối tượng window nếu đang thao tác trên cửa sổ hiện hành Ví dụ: window.location Ngoài các đối tượng do chương trình xây dựng sẳn, có thể tạo thêm những đối tượng mới cần thiết cho nhu cầu sử dụng. Mỗi đối tượng đều có các thuộc tính, phương thức và sự kiện của nó.a) Thuộc tính (Properties): là nơi chứa các mô tả thông tin của đối tựơng.Ví dụ:Trong tag Img có 3 thuộc tính src, width, height,Để thay đổi kích thước của hình ta dựa vào thuộctính Id là Idh1. Idh1.width, Idh1.height Idh1.srcVí dụ function ZoomIn() { Idh1.width=Idh1.width +10; Idh1.height=Idh1.height + 5; } function ChangeImg(file) { Idh1.src=file ; }b) Sự kiện (event): là các hành động, sự việc xãy ra trên trang web: click chuột, di chuyển chuột,… Sự kiện được xử lý bởi các đoạn mã kịch gọi là bộ xử lý sự kiện  Cách sử dụng các sự kiện: muốn điều khiển sự kiện, ta thêm sự kiện đó vào trong thẻ HTML.  Cú pháp: < TagName eventhandler=”JavaScriptCommand”>  TagName: tên tag  eventhandler: tên sự kiện  JavaScript Command: gọi hàm xử lý sự kiện Tên sự kiện Ý nghĩaOnmousedown Phát sinh khi người sdụng nhấn chuộtOnmouseover Phát sinh khi người sdụng d/chuyển chuột lên đối tượngOnmouseout Phát sinh khi người sdụng d/chuyển chuột ra ngoài đtượng Onkeypress Phát sinh khi người sử dụng nhấn một phím Onfocus Phát sinh khi đối tượng nhận tiêu điểm Onblur Phát sinh khi rời khỏi đối tượng - Người dùng click chuột vào đối tượng - Một đối tượng đang có tiêu điểm, người sd nhấn enter Onclick -Một checkbox hoặc nút chọn đang có tiêu điểm, người sd nhấn phím Spacebar Onload - Phát sinh khi đối tượng được tải xuống - Phát sinh khi đối tượng được nạp trở lại hoặc chuyển OnUnload trang Onresize - Phát sinh khi cửa sổ bị thay đổi kích thước Onselect - Phát sinh khi đối tựơng được chọn Onchange - Phát sinh khi đối tượng thay đổi giá trị Onsubmit - Phát sinh khi Form được Submitc) Phương thức Method(): Là các hàm đươc xây dụng trước có tác dụng làm thay đổi thuộc tính của đối tượng. Cách truy xuất vào phương thức của đối tượng Object_name.Method()3. Xây dựng một đối tượng mới:  Cách xây dựng một đối tượng mới: Gồm 2 bước a) Bước 1: Định nghĩa đối tượng bằng cách xây dựng hàm cho đối tượng đó gồm các phương thức và thuộc tính cho đối tượng đó. function Object(List Parameter) { this.property1= Parameter1; this.property2= Parameter2; … this.method1=functionName1; this.method2=functionName2; … }Trong đó Từ khoá this để tham chiếu đến đối tượng đang được tạo. Câu lệnh this.property1= Parameter1: gán giá trị Parameter1 cho thuộc tính property1 Tương tự: muốn xâydựng phương thức cho đối tượng thì gán phương thức cho hàm đã định nghĩa sẵn this.method1=FunctionName1; b) Bước 2: Tạo instance cho đối tượng, var obj=new Object(); ...