Đang chuẩn bị liên kết để tải về tài liệu:
DHTML Utopia Modern Web Design Using JavaScript & DOM- P3

DHTML Utopia Modern Web Design Using JavaScript & DOM- P3:In a single decade, the Web has evolved from a simple method of delivering technical documents to an essential part of daily life, making and breaking relationships and fortunes along the way. “Looking something up on the Internet,” by which is almost always meant the Web, is now within reach of almost anyone living in a first-world country, and the idea of conducting conversations and business (and probably orchestras) in your Web browser is no longer foreign, but part of life | Chapter 2 The Document Object Model Note that Element is plural in this method s name but singular for getElementById. This is a reminder that the former returns an array of elements while the latter returns only a single element. Walking from Parents to Children Each node has one parent except the root element and may have multiple children. You can obtain a reference to a node s parent from its parentNode property a node s children are found in the node s childNodes property which is an array. The childNodes array may contain nothing if the node has no children such nodes are called leaf nodes . Suppose the variable node points to the ul element of the DOM tree. We can get the node s parent the div element like this parent node.parentNode We can check if the unordered list has any list items children by looking at the length property of the childNodes array if node.childNodes.length 0 alert no list items found If there are any children their numbering starts at zero. We can obtain the second child in our example HTML an li element as follows list_item node.childNodes 1 For the special case of the first child located here list_item node.childNodes 0 we can also use this shorthand child node.firstChild Similarly the last child in this case the second li has its own special property child node.lastChild We ll see all these properties used routinely through the rest of this book. 20 Licensed to siowchen@darke.biz What to do with Elements What to do with Elements Now you know how to get references to elements the nodes in your HTML page. The core of DHTML the D-for-dynamic bit lies in our ability to change those elements to remove them and to add new ones. Throughout the rest of this chapter we ll work with the following code snippet which we saw earlier div id codesection p id codepara p ul li a href http www.sitepoint.com id splink SitePoint a li li a href http www.yahoo.com id yalink Yahoo a li ul div Changing Element Attributes Every property of an element and .