您的位置：首页 > Web前端 > JavaScript

JavaScript DOM API初步（整理）

2013-11-15 17:14 531 查看

文档对象模型

文档对象模型(Doucment Object Model,DOM)是表示文档(如HTML文档、XML文档)和访问、操作构成文档的各种元素的应用程序接口。在DOM中，HTML文档的层次结构被表示成树形结构。树的节点表示文档中的各种内容。

在Dom中一切都是Node对象

Element，TextNode，Attribute，Comment都是Node的子类。也就是说，Node对象的所有属性和方法，对于Element，TextNode，Attribute，Comment都适用，并且Element，TextNode， Attribute，Comment提供了特殊的属性和方法来提了特殊作。

Node接口为遍历和操作树定义了属性和方法

Node对象的childNodes属性将返回子节点的列表NodeList对象，firstChild、lastChild、nextSibling、previousSibling和parentNode属性提供了遍历树的方法。appendChild()、removeChild()、replaceChild(old,new)和insertBefore()方法，可以给文档树添加节点或从文档中删除节点。

如何遍历Node节点？

在Node属性中有一个childNodes属性返回一个NodeList对象，该对象是一个Node对象的集合，不是java.util.List的子类，那么如何使用呢？该对象提供一个属性和一个方法非常方便的对NodeList集合提供遍历。

length属性指出NodeList中有多少node对象。

item (index) 方法可以检索childNodes对象中第index位置中的Node对象。

示例（Java语法）：

NodeList nl = doc.getElementsByTagName_r("*");
Node n;
n = nl.item(0);
System.out.print(n.getNodeName());


文档树中不同类型节点由特定Node子接口表示，每个Node对象都有nodeType属性，指定节点的类型。

常用节点类型

接口　　nodeType常量nodeType值
ElementNode.ELEMENT_NODE1
TextNode.TEXT_NODE3
DocumentNode.DOCUMENT_NODE9
CommentNode.COMMENT_NODE8
DocumentFragmentNode.DOCUMENT_FRAGMENT_NODE11
AttrNode.ATTRIBUTE_NODE2

Node 对象的属性

属性描述IEFOW3C
baseURI返回节点的绝对基准 URI。No1NoYes
childNodes返回节点到子节点的节点列表。519Yes
firstChild返回节点的首个子节点。519Yes
lastChild返回节点的最后一个子节点。519Yes
localName返回节点的本地名称。No19Yes
namespaceURI返回节点的命名空间 URI。No19Yes
nextSibling返回节点之后紧跟的同级节点。519Yes
nodeName返回节点的名称，根据其类型。519Yes
nodeType返回节点的类型。519Yes
nodeValue设置或返回节点的值，根据其类型。519Yes
ownerDocument返回节点的根元素（document 对象）。519Yes
parentNode返回节点的父节点。519Yes
prefix设置或返回节点的命名空间前缀。No19Yes
previousSibling返回节点之前紧跟的同级节点。519Yes
textContent设置或返回节点及其后代的文本内容。No1NoYes
text返回节点及其后代的文本（IE 独有的属性）。5NoNoNo
xml返回节点及其后代的 XML（IE 独有的属性）。5NoNoNo

Node 对象的方法

方法描述IEFOW3C
appendChild()向节点的子节点列表的结尾添加新的子节点。519Yes
cloneNode()复制节点。519Yes
compareDocumentPosition()对比两个节点的文档位置。No1NoYes
getFeature(feature,version)返回一个 DOM 对象，此对象可执行带有指定特性和版本的专门的 API。NoYes
getUserData(key)返回与此节点上的某个键相关联的对象。此对象必须首先通过使用相同的键来调用 setUserData 被设置到此节点。NoYes
hasAttributes()判断当前节点是否拥有属性。No19Yes
hasChildNodes()判断当前节点是否拥有子节点。519Yes
insertBefore()在指定的子节点前插入新的子节点。519Yes
isDefaultNamespace(URI)返回指定的命名空间 URI 是否为默认。NoYes
isEqualNode()检查两个节点是否相等。NoNoNoYes
isSameNode()检查两个节点是否是相同的节点。No1NoYes
isSupported()返回当前节点是否支持某个特性。9Yes
lookupNamespaceURI()返回匹配指定前缀的命名空间 URI。No1NoYes
lookupPrefix()返回匹配指定命名空间 URI 的前缀。No1NoYes
normalize()合并相邻的Text节点并删除空的Text节点。519Yes
removeChild()删除（并返回）当前节点的指定子节点。519Yes
replaceChild()用新节点替换一个子节点。519Yes
selectNodes()用一个 XPath 表达式查询选择节点。6
selectSingleNode()查找和 XPath 查询匹配的一个节点。6
transformNode()使用 XSLT 把一个节点转换为一个字符串。6
transformNodeToObject()使用 XSLT 把一个节点转换为一个文档。6
setUserData(key,data,handler)把对象关联到节点上的一个键上。NoYes

DOM API提供了引用文档中元素的方法

getElementsByTagName(var tagName)

返回NodeList对象(NodeList对象行为与数组相似，我们可以认为这个函数返回一个以tagName指定的元素名组成的数组)，它可以获得任何类型的HTML元素的列表。注意，因为HTML标记不区分大小写，所以传递给该方法的字符串也不区分大小写。如果把"*"传给getElementsByTagName()方法，将返回文档中所有元素的列表，顺序以在文档中出现的顺序。

getElementById(var id)

该方法返回一个元素，该元素具有匹配的id属性。Document对象和Element对象都具有这两个方法。

DOM树的根节点是个Document对象，它的documentElement属性引用表示文档根元素的Element对象。大部分DOM树由表示标记(如<html>和<i>)的Element对象和表示文本串的Text对象构成。

Element接口的getAttribute()方法、setAttribute()方法和removeAttribute()方法可以查询、设置和删除一个元素的性质。

本文参考：

http://blog.sina.com.cn/s/blog_4ab0d57401009kw1.html

http://www.w3school.com.cn/xmldom/dom_node.asp

http://developer.51cto.com/art/201009/224979.htm
内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 点击这里给我发消息
标签： 
相关文章推荐
新的分享
章节导航