javaScript DOM特征/方法
日期：2014-05-16 浏览次数：20479 次
? DOM的核心： Node
由于DOM是树形结构，所以一个节点被抽象为对象Node，这是DOM的核心对象：
Node的种类一共有12种，通过Node.nodeType的取值来确定（为1-12），分为：
Node.ELEMENT_NODE (1) Node.ATTRIBUTE_NODE (2) Node.TEXT_NODE (3) //<![CDATA[ ]]>中括着的纯文本，它没有子节点 Node.CDATA_SECTION_NODE (4) //子节点一定为TextNode Node.ENTITY_REFERENCE_NODE (5) Node.ENTITY_NODE (6) //DTD中的实体定义<!ENTITY foo “foo”>，无子节点 Node.PROCESSING_INSTRUCTION_NODE (7) //PI，无子节点 Node.COMMENT_NODE (8) Node.DOCUMENT_NODE (9) //最外层的Root element,包括所有其它节点 Node.DOCUMENT_TYPE_NODE (10) //DTD，<!DOCTYPE………..> Node.DOCUMENT_FRAGMENT_NODE (11) Node.NOTATION_NODE (12) //DTD中的Nation定义
? Node接口包含的特性/方法
节点的属性
nodeName 属性将返回一个字符串，其内容是给定节点的名字。如果节点是元素节点，返回这个元素的名称；如果是属性节点，返回这个属性的名称；如果是文本节点，返回一个内容为#text 的字符串；
nodeType 属性将返回一个整数，这个数值代表给定节点的类型
nodeValue 属性将返回给定节点的当前值.如果节点是元素节点，返回null；如果是属性节点，返回这个属性的名称；如果是文本节点，返回文本节点的内容；
ownerDocument 指向这个节点所属的文档
attributes 包哈勒代表一个元素的特性的Attr对象；仅用于Element节点
childNodes 所有子节点的列表
firstChild 指向在childNodes列表中的第一个节点
lastChild 指向在childNodes列表中的最后一个节点
nextSibling 指向后一个兄弟节点；如果这个节点就是最后一个兄弟节点，那么该值为null
previousSibling 指向前一个兄弟节点；如果这个节点就是第一个兄弟节点，那么该值为null
parentNode 返回一个给定节点的父节点
? hasChildNodes() 当childNodes包含一个或多个节点时，返回真
? appendChild(node) 将node添加到childNodes的末尾
? removeChild(node) 将node从childNodes中删除
? insertBefore(newnode refnode) 在childNodes中的refnode之前插入newnode
var container = document.getElementById("content");
var message = document.getElementById("fineprint");
var para = document.createElement("p");
container.insertBefore(para,message);
? ? replaceChild(newnode,oldnode)将childNodes中的oldnode替换成newnode
var container = document.getElementById("content");
var message = document.getElementById("fineprint");
var para = document.createElement("p");
container.replaceChild(para,message);
?? 获得Node：
/* 通过document对象 */ var oHtml = document.documentElement; /* 得到<head />和<body /> */ var oHead = oHtml.firstChild; var oBody = oHtml.lastChild; /* 可以用这种方式 */ var oHead = oHtml.childNodes[0]; var oBody = oHtml.childNodes[1]; /* 也可以使用方法获取数组的索引值 */ var oHead = oHtml.childNodes.item(0); var oBody = oHtml.childNodes.item(1); /* 使用document.body来得到<body /> */ var oBody = document.body;
? createElement(element)
创建一个指定标签名创建一个新的元素节点，返回值为指向新建元素节点的引用指针。
eg) var para = document.createElement("p");
document.body.appendChild(para);
? createTextNode()
创建一个包含着给定文本的新文本节点，返回一个指向新建文本节点的引用指针：
reference = document.createTextNode()
参数为新建文本节点所包含的文本字符串
var message = document.createTextNode("hello world");
var container = document.createElement("p");
container.appendChild(message);
document.body.appendChild(container);
?? cloneNode()
reference = node.cloneNode(deep)
为给定节点创建一个副本，参数为 true 或者 false，true 表示同时复制该节点的子节点，false 则不复制任何子节点。
var para = document.createElement("p");
var message = document.createTextNode("hello world");
para.appendChild(message);
document.body.appendChild(para);
var newpara = para.cloneNode(true);
document.body.appendChild(newpara);
? 检测节点类型
通过使用nodeType特性检验节点类型：
alert(document.nodeType); //outputs "9"
alert(document.documentElement.nodeType); //outputs "1"
这个例子中，document.nodeType返回9，等于Node.DOCUMENT_NODE；同时document. documentElement.nodeType返回1，等于Node.ELEMENT_NODE。
也可以用Node常量来匹配这些值：
alert(document.nodeType == Node.DOCUMENT_NODE); //true
alert(document.documentElement.nodeType == Node.ELEMENT_NODE); //true
这段代码可以在Mozilla 1.0+、Opera 7.0+和Safari 1.0+上正常运行。但是IE不支持这些常量，所以这些代码在IE上会产生错误。
? 处理特性
即便Node接口已具有attributes方法，且已被所有类型的节点继承，然而，只有Element节点才能有特性。
Element节点的
