DOM节点例子
Posted 鱼樱、、
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了DOM节点例子相关的知识，希望对你有一定的参考价值。
elementNode.setAttribute(name,value)
1.name: 要设置的属性名。
2.value: 要设置的属性值。
elementNode.getAttribute(name)
1. elementNode：使用getElementById()、getElementsByTagName()等方法，获取到的元素节点。
2. name：要想查询的元素节点的属性名字
元素节点：构成了DOM的基础。文档结构中，<html>是根元素，代表整个文档，其他的还有<head>,<body>,<p>,<span>等等。元素节点之间可以相互包含(当然遵循一定的规则)
文本节点：包含在元素节点中。
属性节点：元素都可以包含一些属性，属性的作用是对元素做出更具体的描述，比如id,name之类的。
nodeName 属性
nodeName 属性规定节点的名称。
nodeName 是只读的
元素节点的 nodeName 与标签名相同
属性节点的 nodeName 与属性名相同
文本节点的 nodeName 始终是 #text
文档节点的 nodeName 始终是 #document
注释：nodeName 始终包含 HTML 元素的大写字母标签名。
nodeValue 属性
nodeValue 属性规定节点的值。
元素节点的 nodeValue 是 undefined 或 null
文本节点的 nodeValue 是文本本身
属性节点的 nodeValue 是属性值
nodeType 属性
nodeType 属性返回节点的类型。nodeType 是只读的。
比较重要的节点类型有：
元素类型 NodeType
元素 1
属性 2
文本 3
注释 8
文档 9
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body><div>
<span id="span">各类节点</span>
</div>
<script type="text/javascript">
window.onload = function() {
var element = document.getElementById("span");
var text = element.firstChild;
var property = document.getElementById("span").getAttributeNode("id");
//nodeName
alert("这是元素节点的返回值：" + element.nodeName); //返回的标签名SPAN,注意是大写的
alert("这是文本节点的返回值：" + text.nodeName); //返回的#text
alert("这是属性节点的返回值：" + property.nodeName); //返回的是属性名，这里是id
//nodeValue
alert("这是元素节点的返回值："+ element.nodeValue);//本身就没有意义，返回的是null
alert("这是文本节点的返回值："+ text.nodeValue);//返回的是文本值 各类节点
alert("这是属性节点的返回值："+ property.nodeValue);//返回的是属性值，这里是id的属性值 span
//nodeType
alert("这是元素节点的返回值："+ element.nodeType);//元素节点返回1
alert("这是文本节点的返回值："+ text.nodeType);//文本节点返回3
alert("这是属性节点的返回值："+ property.nodeType);//属性节点返回2
}
</script>
</body>
</html>
以上是关于DOM节点例子的主要内容，如果未能解决你的问题，请参考以下文章
JavaScript：js删除dom节点或div的2种常见方式，附例子和运行效果