TGML Standard DOM Methods (Commonly Used)

The following is an overview of standard DOM methods that can be used to access graphics elements and attributes.

See W3C Document Object Model (DOM) Level 3 Core Specification for more information.

Object	Method	Description
Any element	getAttribute("‹attribute›")	Returns the value of ‹attribute›.
Any element	getChildNodes()	Returns a NodeList that contains all children of this node.
Any element	getOwnerDocument()	Returns the document.
Any element	getParentNode()	Returns the parent element.
Any element	getTagName()	Returns the element tag name, e.g. Rectangle or Bind.
Any element	setAttribute("‹attribute›", "‹value›")	Sets the value of ‹attribute› to ‹value›. If the element does not have the attribute, it is created (as a TGML custom attribute).
Document	getDocumentElement()	Returns the TGML (root) element.
Document	getElementById("‹Id›")	Returns the child element that has the Id attribute with the given value.
Document	getElementsByTagName ("‹tagName›")	Returns a NodeList of all the elements in document order with a given tag name.
NodeList	getLength()	Returns the number of elements in the NodeList.
NodeList	item("‹index›")	Returns the element at ‹index› in the NodeList.

Example:

Copy

<TGML>
    <Rectangle Left="50" Top="50 Width="100" Height="100" Fill="#C0C0C0" Stroke="#000000">
        <Script OnMouseOver="over" OnMouseOut="out"><![CDATA [
            function over(evt)
            {
                // Change fill color while hovering
                var rectangle = evt.getTarget();
                
                // Get the original fill color and store it
                // as a custom attribute of the rectangle
                var color = rectangle.getAttribute("Fill");
                rectangle.setAttribute("originalColor", color);
                
                // Change the color to blue
                rectangle.setAttribute("Fill", "#0000FF");
            }
            
            function out(evt)
            {
                // Restore the fill color
                var rectangle = evt.getTarget();
                var color = rectangle.getAttribute("originalColor");
                rectangle.setAttribute("Fill", color);
            }    
        ]]></Script>

    </Rectangle> 
</TGML>