首页 > 代码库 > 文档对象模型DOM
文档对象模型DOM
1、节点：
文档节点Document
元素节点Element
文本节点Text
属性节点Attr
注释节点Comment
2、节点的属性和方法:
nodeType:判断节点类型
ownerDocument:指向这个节点所属的文档
firstChild:指向在childNodes列表中的第一个节点
lastChild:指向在childNodes列表中的最后一个节点
childNodes:所有子节点的列表
previousSibling:指向前一个兄弟节点；如果这个节点就是第一个兄弟节点，那么该值为null
nextSibling:指向后一个兄弟节点；如果这个节点就是最后一个兄弟节点，那么该值为null
hasChildNodes():当childNodes包含一个或多个节点时
attributes:包含了代表一个元素的特性的Attr对象；仅用于Element节点
appendChild(node):将node添加到childNodes的末尾
removeChild(node):从childNodes中删除node
replaceChild(newnode,oldnode):将childNodes中的oldnode替换成newnode
insertBefore(newnode,refnode):在childNodes中的refnode之前插入newnode
3、助手对象
NodeList:用来表示一个元素的子节点
NamedNodeMap:用于表示元素特性
4、访问相关的节点
访问<html/>元素:var ohtml=document.ducumentElement;
取得<head/>和<body/>元素:var oHead=ohtml.firstChild或var oHead=ohtml.childNodes[0]
或var oHead=ohtml.childNodes.item(0);
var oBody=ohtml.lastChild或var oBody=ohtml.childNodes[1]
或var oHead=ohtml.childNodes.item(1);;
获取子节点的数量：alert(ohtml.childNodes.length);
查询是否存在一个子节点：hasChildNodes()。
定义document.body作为指向<body/>元素的指针：var oBody=document.body;
parentNode
5、检测节点类型(nodeType)
6、处理元素属性
getAttribute(name):返回node属性值等于name的节点；
setAttribute(name,newname):更改
removeAttribute(name):删除node属性值等于name的节点；
var sId=op.getAttribute("id"):获取id特性。
7、访问指定节点
1）getElementsByTagName()
var oImgs=document.getElementByTagName("img");
alert(oImg[0].tagName);
var oPs=document.getElementsByTagname("p"); var oImgsInP=oPs.getElementsByTagName("img"); 用星号的方法来获取document中的所有元素。但IE必须使用document.all来代替它
2）getElementsByName()（获取所有name属性等于指定值的元素）
3)getElementById()
8、创建和操作节点
1）createElement()、createTextNode()、appendChild()
var oP=document.createElement("P");
var oText=document.createTextNode("Hello world!");
oP.appendChild(oText);
document.body.appendChild(oP);
在body里面写onload。
2）removeChild()删除节点、replaceChild()替换节点、insertBefore()插入节点，可以让新消息出
现在旧消息之前。
3)createDocumentFragment():创建一个文档碎片，把所有的新节点附加其上，然后把文档碎片的内容
一次性添加到document中。
4）cloneNode()复制节点
5）操作文本节点 访问文本节点事例：textNode=document.getElementById(‘p1‘).firstChild; 用length属性访问它的长度，data属性设置它的属性值。 方法：apppendData(string):将字符串添加在文本节点的文本末尾。 deleteData(offset,count):删除文本节点中从指定位置开始的指定数量的字符。 insertData(offset,string):将指定字符串插入到文本节点指定的位置中。 replaceData(offset,count,string):用给定的字符串替换文本节点指定位置指定数量的文
本数据。 splitText(offset):将指定位置的文本节点分成两部分，将右边的部分返回为一个新的文本
节点，将左边的部分留在原始位置。 substringData(offset,count):从文本节点的文本数据中返回指定位置指定数目的字符串。
9、HTML DOM特征功能 1）让特性像属性一样。className 2）table方法 3）innerHTML
文档对象模型DOM