JavaScript文檔對象模型DOM
DOM 解析模型，將文檔加載到 內存，形成一個樹形結構 就是根節點，每個標籤會成爲一個元素節點、標籤的屬性成爲屬性節點，標籤內部的文本內容成爲文本節點
注意：屬性節點，它不屬於DOM樹形結構，不屬於任何節點父節點，也不屬於任何節點的子節點 ，屬性節點依附於元素節點上 一種附加節點
DOM元素常見操作
DOM 獲取節點：節點查詢 參上
DOM 改變節點： 元素屬性修改setAttribute(name,value)
內部文本元素的修改 innerHTML
DOM 刪除節點：removeChild 刪除子元素 、removeAttribute(name)刪除節點指定屬性
* 要刪除節點o o.parentNode.removeChild(o)
DOM 替換節點：replaceChild：父節點.replaceChild(新節點,被替換節點) ;
如果對於一個已經存在節點，執行 appendChild、 replaceChild都會造成該節點一個移動效果，可以採取先克隆再複製來消除此效果。
DOM 創建節點：document對象提供createElement() 創建元素、createAttribute(name) 創建屬性、createTextNode() 創建文本節點
DOM 添加節點 appendChild 父元素.appendChild(新的子節點) ;
insertBefore 父節點.insertBefore(新子節點, 已經存在子節點)
DOM 克隆節點 源節點.cloneNode(true); 該方法可以返回一個節點的克隆節點， 克隆節點包含原節點的屬性和子元素 DOM開發
window.document 代表整個HTML文檔
①：通過document獲得Node節點對象
document.forms 獲得頁面中所有form元素集合
document.body 訪問頁面中<body> 元素
document.cookie 用JS操作網頁cookie信息
全局檢索提供了三個重要的方法：
document.getElementById():通過id屬性檢索，獲得Node節點（Element元素）
document.getElementsByName 通過name 屬性檢索 ，獲得NodeList
document.getElementsByTagName 通過標籤元素名稱 獲得NodeList
其中NodeList可以作爲數組進行操作
Demo:在每一個h1標籤後追加itcast
<script type="text/javascript">
//在每一個h1標籤內追加一個itcast
window.onload = function(){
var nodeList = document.getElementsByTagName("h1");
for(var i=0; i<nodeList.length;i++){
// var h1 = nodeList[i];
var h1 = nodeList.item(i);
alert(h1.innerHTML);
h1.innerHTML += "itcast";
}
}
</script>
<body>
<h1>AAA</h1>
<h1>BBB</h1>
<h1>CCC</h1>
<h1>DDD</h1>
</body>
②：獲得node後
如果node是元素，去操作裏面的文本內容 innerHTML (HTML頁面內所有元素，一定是HTML 元素，innerHTML 是所有HTML元素通用屬性 )
XML 取得一個元素內部文本內容 element.firstChild.nodeValue(看批註32)
③：通過節點Node相對位置關係訪問元素
childNodes
firstChild
lastChild
nextSibling
parentNode
previousSibling
用2種方式打印——明天休息
<h1 id="h1">明天休息</h1> <br>
var h1 = document.getElementById("h1");
alert(h1.innerHTML);//方式一
alert(h1.firstChild.nodeValue);//方式二