Florida web design - 277Chapter 15Generic HTML Element ObjectsThe variable anow holds
277Chapter 15Generic HTML Element ObjectsThe variable anow holds the clone of the original node, so you can change its idattribute atthis point by entering the following statement: a.setAttribute( id , Dolly ) If you want to see the properties of the cloned node, enter ainto the lower text field. The pre- cise listing of properties you see depends on the browser you re using; in either case, youshould be able to locate the idproperty, whose value is now Dolly. As a final step, append this newly named node to the end of the bodyelement by entering thefollowing statement into the topmost text field: document.body.appendChild(a) You can now scroll down to the bottom of the page and see a duplicate of the content. Butbecause the two nodes have different idattributes, they cannot confuse scripts that need toaddress one or the other. Related Items:Nodeobject (Chapter 14); appendChild(), removeChild(), removeNode(), replaceChild(), and replaceNode()methods. componentFromPoint(x,y) Returns:String. Compatibility:WinIE5+, MacIE-, NN-, Moz-, Safari- The componentFromPoint()method assists in some event-related tasks. You can use it for akind of collision detection (in other words, to determine whether an event occurs inside oroutside of a particular element). If the element has scrollbars, the method can provide addi- tional information about the event such as precisely which component of the scrollbar theuser activates. A key aspect of this method is that you invoke it on any element that you want to use as thepoint of reference. For example, if you want to find out if a mouseupevent occurs in an ele- ment whose ID is myTable, invoke the method as follows: var result = document.getElementById( myTable ).componentFromPoint( event.clientX, event.clientY); Parameters passed to the method are xand ycoordinates. These coordinates do not have tocome from an event, but the most likely scenario links this method with an event of somekind. Mouse events (other than onclick) work best. The value returned by the method is a string that provides details about where the coordinatepoint is with respect to the current element. If the coordinate point is inside the element s rect- angle, the returned value is an empty string. Conversely, if the point is completely outside of theelement, the returned value is the string outside . For scrollbar pieces, the list of possiblereturned values is quite lengthy (as shown in Table 15-8). Table 15-8: Returned Values for componentFromPoint() Returned StringElement Component at Coordinate PointscrollbarDownScrollbar down arrowscrollbarHThumbScrollbar thumb on horizontal barscrollbarLeftScrollbar left arrowContinuedelementObject.componentFromPoint()