Node

A Node is an interface from which a number of DOM types, and allows these various types to be treated similarly.

Properties

• Node.baseURI: return a DOMStirng representing the base URL
• Node.childNodes: return a live NodeList containing all the children of this node. NodeList being live means that if the children of the Node change, the NodeList will update automatically.
• Node.firstChild: return a Node representing the first direct child Node of this Node, or Null if the node has no child.
• Node.lastChild: Return a Node representing the last direct child Node of this Node, or Null if the node has no child.
• Node.nextSibling: return a Node representing the next Node in the tree, or null if there is no one.
• Node.previousSibling
• Node.nodeName: return a DOMString containing the name of the node. The structure of the name will differ with the name type. E.g. An HTMLElement will contain the name of the corresponding tag, like “audio”, for an HTMLAudioElement, a Text node will have the “#text” string, or a Document node will have the “#document” string.
• Node.nodeType: return an unsigned short representing the type of the node. Possible values are:

Name	Value
Element_Node	1
Attribute_Node	2
Text_Node	3
...	...
Document_Node	9
Document_Type_Node	10
Notation_Node	12

• Node.nodeValue: return a DOMString representing the value of an object. For most node types, this returns null, and any set operation is ignored.
  For Nodes of type TEXT_NODE(Text objects), COMMENT_NODE(Comment objects), and PROGRESSING_INSTRUCTION_NODE(ProgressingInstruction objects), the value corresponds to the text data contained in the obejct.
• Node.parentNode: return a Node that is the parent of this node, if there is no such node, like if this node is the top of the tree or if doesn’t participate in a tree, this property returns Null.
• Node.parentElement: returns an Element that is the parent of this node. If the node has no parent, or if that parent is not an Element, this property returns Null.
• Node.rootNode: return a Node representing the topmost Node in this tree or the current node if it’s the topmost node in the tree.
• Node.textContent: is a DOMString representing the textual content of an element and all its descendants.

Methods

• Node.appendChild()

• Node.cloneNode(): Clone a Node and optionally all of its contents. By default, it clones the content of the node.

• Node.hasChildNodes(): return a boolean indicating if the element has any child nodes, or not.

• Node.insertBefore(newNode, beforeItsChild)

• Node.isEqualNode(): return a boolean which indicating whether or not two nodes are of the same type and all their defining data points match.

• Node.isSameNode(): return a boolean value indicating whether or not the two nodes are the same(that is they reference the same object).

• Node.removeChild()

• Node.replace(newNode, replaceItsChild)

  *   Note: replaceNode will not generate new one.</p>

  • E.g.

    ul>li*3

    ul.replace(li[2],li[0])

    it will act as:
    remove li[2], put it li[0], remove li[0], so the result looks like

    ul

  –li[2]
  –li[1]
  `

  Examples

  Browser All Child Nodes

  The following function recursively cycles all child nodes of a node and executes a callback function upon them(and upon the parent node itself).

  `function DOMComb(oParent, oCallBack){
    if(oParent.hasChildNodes()){
      for(var oNode = oParent.firstChild; oNode; oNode = oNode.nextSibling){
        DOMComb(oNode, oCallBack);
      }
    }
    oCallBack.call(oParent);
  }
  `

  Remove all children nested within a node

  `Element.prototype.removeAll = function(){
    while(this.firstChild){
      this.removeAll(this.firstChild);
    }
    return this;
  };