DOM基本操作（上）

一.介绍
DOM(Document Object Model) : 操作一切结构化文档的通用API，用DOM即可操作HTML，又可操作XML，可实现增，删，改，查。

二.DOM节点类型及属性
根据W3C 的 HTML DOM 标准，HTML 文档中的所有内容都是节点：
整个文档是一个文档节点

  document对象：文档类型(Document)  9
     元素节点：元素类型(Element)   1
     文本节点：文本类型(Text)   3
     属性节点：属性类型(Attr)   attribute  2
     注释节点 (comment)  8

节点四个属性

nodeName 元素的标签名 大写 只读不能写
nodeValue 元素的文本内容 text节点和comment节点起作用 可读写 nodeType 节点类型
attributes 节点的属性集合 类数组

判断是否包含指定属性：

elem.hasAttribute(“属性名”)–>有，true；没有，false

三.DOM方法

方法	描述
getElementsByClassName()	找到指定类名的所有元素的节点列表（IE8及IE8以下不兼容）
getElementById()	找到指定ID的元素（IE8以下不区分id的大小写）
getElementsByTagName()	找到指定标签的所有元素的节点列表（无兼容问题）
getElementsByName	通过带有name属性的元素找到该元素 （旧浏览器只支持部分标签）
appendChild()	将新的子节点添加到指定节点
removeChild()	删除子节点
replaceChild()	替换子节点
insertBefore()	在指定的子节点前面插入新的子节点
createElement()	创建属性节点
createAttribute()	创建元素节点
createTextNode()	创建文本节点
getAttribute()	找到指定的属性值
setAttribute()	将指定属性设置或修改为指定的值

*有兼容性问题*
                    节点树        vs    元素节点树
        父节点   parentNode           parentElementNode
    所有子节点   childNodes           children IE9以下支持
  第一个子节点   firstChild           firstElementChild IE9以下不兼容
最后一个子节点   lastChild            lastElementChild IE9以下不兼容
    前一个兄弟   previousSibling      previousElementSibling
    后一个兄弟   nextSibling          nextElementSibling
    childElementCount      子节点个数
    
	取出当前结构中的所有元素节点,不能使用children