- DOM是針對HTML和XML文檔的一個API献宫。DOM描繪了一個層次化的節(jié)點樹钥平，允許開發(fā)人員添加、移除和修改頁面的某一部分姊途。
<html>
<head>
<meta charset="UTF-8">
<title>hellow world</title>
</head>
<body>
<div class="div">
</div>
</body>
</html>
- 文檔節(jié)點是每個文檔的根節(jié)點涉瘾。在這個例子中，文檔節(jié)點只有一個根節(jié)點捷兰，即<html>元素稱之為文檔元素立叛，每個文檔只能有一個文檔元素。在HTML頁面中贡茅，文檔元素時鐘都是<html>元素秘蛇。每一段標記都可以通過樹中的一個節(jié)點表示：HTML元素通過元素節(jié)點表示其做，特性（attribute）通過特性節(jié)點表示，文檔類型通過文檔類型節(jié)點表示赁还，而注釋則通過注釋節(jié)點表示庶柿。總共有12種節(jié)點類型秽浇，這些類型都繼承自一個基類型浮庐。
1.Node類型
javascript中的所有節(jié)點類型都繼承自Node類型，因此所有類型都共享著相同的基本屬性和方法柬焕。每個節(jié)點都有一個nodeType屬性审残，用于表明節(jié)點的類型。要了解節(jié)點的具體信息斑举，可以使用nodeName和nodeValue這兩個屬性搅轿。這兩個屬性的值完全取決于節(jié)點的類型，在使用這兩個值之前富玷，可以像下面一樣檢測一下
if(someNode.NodeType == 1){
value = someNode.nodeName;
alert(value);
}
2.節(jié)點關系璧坟。
在HTML中，可以將<body>看成是<html>元素的子元素赎懦，每一個節(jié)點都有一個childNodes屬性雀鹃，其中保存著一個NodeList對象。這個時候打印出來第一個的Nodename是文本類型励两，childNodes把第一個空格當做第一個child作為文本類型黎茎。（好不靠譜的感覺）
<div id="div">
<h1>111111</h1>
<P>1111111</P>
<P>1111111</P>
<P>1111111</P>
<h3>1111111</h3>
</div>
</body>
<script type="text/javascript">
var oDiv=document.getElementById("div");
var array=Array.prototype.slice.call(oDiv.childNodes,0);
for (var i=0;i<array.length;i++) {
alert(array[i].nodeName)
}
</script>
下面列出一些常用的操作節(jié)點的方法：
someNode.lastChild
someNode.firstChild
someNode.nextSibling
someNode.previousSibling
someNode.appendChild //添加至子節(jié)點的最后一個節(jié)點
someNode.insertBefore(newNode,前一個同胞節(jié)點）
//替換第一個節(jié)點
someNode.replaceChild(newNode,someNode.firstChild)
//移除第一個節(jié)點
someNode.removeChild(someNode.firstChild)
- cloneNode()方法
這個方法接收一個布爾值的參數，表示是否執(zhí)行深復制当悔，深復制也就是復制節(jié)點及其整個子節(jié)點樹傅瞻，即只復制節(jié)點本身，復制后返回的節(jié)點副本屬于穩(wěn)當所有盲憎，但沒有為他制定父節(jié)點嗅骄，除非appendChild()、insertBefore()將它添加到文檔中饼疙。
<ul id="ul">
<li>1</li>
<li>1</li>
<li>1</li>
</ul>
<script type="text/javascript">
var oUl=document.getElementById("ul");
var deepList=oUl.cloneNode(true);
alert(deepList.childNodes.length); //3
var qianList=oUl.cloneNode(false);
alert(qianList.childNodes.length); //3
</script>
