节点Node

2015-07-05

节点属性

1 nodeName:节点的名称
- 元素节点的 nodeName 与标签名相同
- 属性节点的 nodeName 是属性的名称
- 文本节点的 nodeName 永远是 #text
- 文档节点的 nodeName 永远是 #document
2 nodeValue 节点的值
- 元素节点的 nodeValue 是 undefined 或 null
- 文本节点的 nodeValue 是文本自身
- 属性节点的 nodeValue 是属性的值
3 nodeType 节点的类型
   元素类型    节点类型
     元素          1
     属性          2
     文本          3
     注释          8
     文档          9

节点的一些操作

 1 访问子节点 childNodes
 语法： elementNode.childNodes
   注意：
   如果选定的节点没有子节点，则该属性返回不包含节点的 NodeList。
 2 访问子节点的第一和最后项
 - firstChild 属性返回‘childNodes’数组的第一个子节点。如果选定的节点没有子节点，则该属性返回 NULL。
     语法： node.firstChild
     说明：与elementNode.childNodes[0]是同样的效果。 
 - lastChild  属性返回‘childNodes’数组的最后一个子节点。如果选定的节点没有子节点，则该属性返回 NULL。
     语法： node.lastChild
     说明：与elementNode.childNodes[elementNode.childNodes.length-1]是同样的效果。 
3 访问父节点 parentNode
    语法：elementNode.parentNode
    注意:父节点只能有一个。
4 访问兄弟节点 
 - nextSibling 属性可返回某个节点之后紧跟的节点（处于同一树层级中）。
 语法： nodeObject.nextSibling
 说明：如果无此节点，则该属性返回 null。
 -  previousSibling 属性可返回某个节点之前紧跟的节点（处于同一树层级中）。
 语法：nodeObject.previousSibling
 说明：如果无此节点，则该属性返回 null。

节点的添加，插入，删除，替换，创建

1 添加节点 appendChild()
在指定节点的最后一个子节点列表之后添加一个新的子节点。
语法：appendChild(newnode)
2 插入节点 insertBefore()
    insertBefore() 方法可在已有的子节点前插入一个新的子节点。
    语法：insertBefore(newnode,node);
  参数:newnode: 要插入的新节点。
      node: 指定此节点前插入节点。
3 删除节点 removeChild()
removeChild() 方法从子节点列表中删除某个节点。如删除成功，此方法可返回被删除的节点，如失败，则返回 NULL。
语法：nodeObject.removeChild(node)
参数： node 必须，指定要删除的节点
4 替换元素节点 replaceChild()
  语法：node.replaceChild (newnode,oldnew ) 
  参数：newnode : 必需，用于替换 oldnew 的对象。 
      oldnew : 必需，被 newnode 替换的对象。
5 创建元素节点 createElement
    createElement()方法可创建元素节点。此方法可返回一个 Element 对象。
    语法：document.createElement(tagName)
    参数：tagName：字符串值，这个字符串用来指明创建元素的类型。
    注意：要与appendChild() 或 insertBefore()方法联合使用，将元素显示在页面中。
 6 创建文本节点 createTextNode
     createTextNode() 方法创建新的文本节点，返回新创建的 Text 节点。
     语法：document.createTextNode(data)