JavaScript Workshop » October 06 Meeting - DOM Properties

Children, parents and siblings decribe the relationships for the current element in the DOM tree and whether it contains other elements or not.  Every node in the document has several properties such as nodeType which describes what the node is and nodeName which is the name of the elementor and finally nodeValue which is the value of the node, null if it is an element.

In the case of text nodes, nodeValue can be read and set, which allows you to alter the text content of the element. If for example, you wanted to change the text of the first paragraph, you would have to access the text node inside in it, in other words, the first child node of the paragraph:

getElementsByTagName('p')[0].firstChild.nodeValue = 'Hello';

The firstChild property can be used as a shortcut. Every element can have any number of children, listed in a property called childNodes. Here is an article (.pdf) by Tom Dell’Aringa that covers nodes in more detail as well as other topics we will cover in upcoming meetings.

Most of our future examples will use techniques covered today and last month. So....practice, practice, practice.