22 www.it-ebooks.info Chapter ■ jQuery Fundamentals 2- 2 Using Conditional... locations: jQuery" name="description"/> 2-4. Understanding the Document Object Model (DOM) - Tài liệu text
  1. Trang chủ >
  2. Công Nghệ Thông Tin >
  3. Quản trị mạng >

2-4. Understanding the Document Object Model (DOM)

Bạn đang xem bản rút gọn của tài liệu. Xem và tải ngay bản đầy đủ của tài liệu tại đây (17.05 MB, 621 trang )


Chapter 2 ■ jQuery Fundamentals





















Employee NameDepartment Name
John SmithTechnology








Figure 2-9 represents the DOM tree of the previous code.



Figure 2-9.  DOM objects tree



31

www.it-ebooks.info



Chapter 2 ■ jQuery Fundamentals



jQuery methods can manage the DOM and its elements by:





Changing HTML elements, including their properties, attributes, and styles







Removing existing HTML elements







Adding new HTML elements







Binding event handlers to HTML elements







Restructuring the DOM



2-5. Navigating the DOM

The DOM hierarchy is represented as a tree structure. In this structure, starting from any node, you can get:

––



Ancestor nodes by traversing upward until you reach the root node. For example, in

Figure 2-9, for the HTMLElement () node, the ancestors are HTMLElement (
),

HTMLElement (), and HTMLElement ().



––



Descendent nodes by traversing downward through all possible branches until you reach leaf

nodes. For example, for the HTMLElement (), the descendents are HTMLElement

(), two HTMLElements (), and four HTMLElements (
).



––



Sibling nodes by traversing to the parent node and then traversing down one level. For

example, for the HTMLElement (