1. Every XHTML element in a page is represented by a DOM tree.
Answer: False. Every element is represented by a DOM node. Each node is a member of the document’s DOM tree.
2. A text node cannot have child nodes.
Answer: True
3. The document node in a DOM tree cannot have child nodes.
Answer: False. The document is the root node, therefore has no parent node.
4. You can change an element’s style class dynamically with the style property.
Answer: False. The style class is changed with the className property
5. The createElement method creates a new node and inserts it into the document.
Answer: False. The createElement method creates a node, but does not insert it into the DOM tree.
6. The setInterval method calls a function repeatedly at a set time interval.
Answer: True
7. The insertBefore method is called on the document object, taking a new node and an existing one to insert the new one before.
Answer: False. insertBefore is called on the parent.
8. The most recently started interval is stopped when the clearInterval method is called.
Answer: False. clearInterval takes an interval identifier as an argument to determine which interval to end.
9. The collection links contains all the links in a document with specified name or id attributes.
Answer: False. The links collection contains all links in a document.
1. The ________ property refers to the text inside an element, including XHTML tags.
Answer: innerHTML.
2. A document’s DOM ________ represents all of the nodes in a document, as well as their relationships to each other.
Answer: tree
3. The ________ property contains the number of elements in a collection.
Answer: length
4. The ________ method allows access to an individual element in a collection.
Answer: item
5. The ________ collection contains all the img elements on a page.
Answer: images
6. The ________ object contains information about the sites that a user previously visited.
Answer: history
7. CSS properties may be accessed using the ________ object.
Answer: style
Modify Fig. 12.3 to use a background color to highlight all the links in the page instead of displaying them in a box at the bottom.
Answer:
Use the Firefox DOM Inspector or the IE Web Developer Toolbar to view the DOM tree of the document in Fig. 12.2. Look at the document tree of your favorite website. Notice the information these tools give you in the right panel(s) about an element when you click it.
Answer:
Write a script that contains a button and a counter in a div. The button should increment the counter each time it is clicked.
Answer:
Write a script that prints out the length of all the JavaScript collections on a page.
Answer:
Create a web page in which users are allowed to select their favorite layout and formatting through the use of the className property.
Answer:
(15 Puzzle) Write a web page that enables the user to play the game of 15. There is a 4-by-4 board (implemented as an XHTML table) for a total of 16 slots. One of the slots is empty. The other slots are occupied by 15 tiles, randomly numbered from 1 through 15. Any tile next to the currently empty slot can be moved into the currently empty slot by clicking on the tile. Your program should create the board with the tiles out of order. The user’s goal is to arrange the tiles in sequential order row by row. Using the DOM and the onclick event, write a script that allows the user to swap the positions of the open position and an adjacent tile. [Hint: The onclick event should be specified for each table cell.]
Answer: Answer to 12.8, 12.9, 12.10
Modify your solution to Exercise 12.8 to determine when the game is over, then prompt the user to determine whether to play again. If so, scramble the numbers using the Math.random method.
Answer: Answer to 12.8, 12.9, 12.10
Modify your solution to Exercise 12.9 to use an image that is split into 16 equally sized pieces. Discard one of the pieces and randomly place the other 15 pieces in the XHTML table.
Answer: Answer to 12.8, 12.9, 12.10