DOM core中
獲取元素的方法
getElementById
通過(guò)元素的id屬性獲取對(duì)象
getElementsByTagName
通過(guò)元素標(biāo)簽名獲取對(duì)象，是一個(gè)數(shù)組
getElementsByClassName
通過(guò)元素的class屬性獲取對(duì)象，也是一個(gè)數(shù)組
獲取對(duì)象的子節(jié)點(diǎn)的屬性
[elt].childNodes
獲取某對(duì)象下的所有子節(jié)點(diǎn)，是一個(gè)數(shù)組來(lái)著的
其中有一些簡(jiǎn)寫
比如：firstChild <==> [elt].childNodes[0] <font color="green">某對(duì)象的第一個(gè)子節(jié)點(diǎn)</font>
還有：lastChild <==> [elt].childNodes[childNodes.length-1] <font color="green">某對(duì)象的最后一個(gè)子節(jié)點(diǎn)</font>
[elt].parentNode
獲取某元素節(jié)點(diǎn)的父元素節(jié)點(diǎn)，只有一個(gè)對(duì)象
[elt].previousSibling
獲取某元素節(jié)點(diǎn)的上一個(gè)兄弟元素節(jié)點(diǎn)
[elt].nextSibling
獲取某元素節(jié)點(diǎn)的下一個(gè)兄弟元素節(jié)點(diǎn)
[elt].nodeType
判斷某個(gè)元素的子節(jié)點(diǎn)的屬性，返回一個(gè)數(shù)字
有三個(gè)常用的需要記住：
1：Element 元素節(jié)點(diǎn)
2：Attribute 屬性節(jié)點(diǎn)
3：Text 文本節(jié)點(diǎn)
[nod].nodeName
返回這個(gè)節(jié)點(diǎn)的節(jié)點(diǎn)名
節(jié)點(diǎn)名有兩種
- 元素名，例如P,BODY,DIV
text 文本節(jié)點(diǎn)or節(jié)點(diǎn)的屬性值
[elt].nodeValue
獲取某個(gè)節(jié)點(diǎn)的文本值
創(chuàng)建節(jié)點(diǎn)的方法及節(jié)點(diǎn)間的操作
createElement(nodeName)
在DOM結(jié)構(gòu)外創(chuàng)建一個(gè)元素（p、div、span等）
createTextNode("string")
在DOM結(jié)構(gòu)外創(chuàng)建一個(gè)文本節(jié)點(diǎn)
parent.appendChild(son)
往parent中的末尾追加son節(jié)點(diǎn)
<html> <div id="mydiv"></div> </html> <script> window.onload=function(){ var mydiv = document.getElementById("mydiv"); var parp = document.createElement("p"); mydiv.appendChild(parp); /*將create的p元素append進(jìn)div之中；*/ } </script>
parent.insertBefore(newElt,targetElt)
在parent中，將newElt添加在targetElt之前
*insertAfter(newElt,targetElt)
<font style="color:green">實(shí)際上在js中并不存在insertAfter的方法，不過(guò)我們可以自己編一個(gè)insertAfter的函數(shù)，然后調(diào)用</font>
function insertAfter(newElt,targetElt){
var parent = targetElt.parentNode;
if(targetElt == parent.lastChild){
parent.appendChild(newElt);
}else {
parent.insertBefore(newElt,targetElt.nextSibling);
}
}
節(jié)點(diǎn)的屬性獲取及操作
[node].getAttribute("attr")
獲取該節(jié)點(diǎn)的attr屬性的值
[node].setAttribute("attr","value")
將該節(jié)點(diǎn)中的attr屬性的值設(shè)置為value
HTML-DOM中
在HTML-DOM中有一些類似HTML core的操作，但是要比core的篇幅要小，在瀏覽器呈現(xiàn)正宗的XHTML文檔（即MIME類型是application/xhtml_xlm的XHTML文檔）時(shí)會(huì)被直接忽略掉，但是在普通的html中，很靈活。
下面列一些常用的HTML-DOM
常見(jiàn)的HTML DOM
| [img].src | 直接獲取或者修改img對(duì)象中的src屬性 |
|---|---|
| [a].href | 直接獲取或者修改a對(duì)象中的href屬性 |
| [input].value | 直接獲取或者修改input對(duì)象中的value屬性 |
| document.forms | 獲取document下所有的form表單元素 |
| document.body | 獲取文檔中的body元素對(duì)象 |
特殊的HTML-DOM
document.innerHTML 獲取或者修改document對(duì)象下的所有“HTML代碼”
例如：
<body>
<div id="test">
<p>This is <em>my</em> content.</p>
</div>
</body>
<script>
var mydiv = document.getElementById("test");
console.log(mydiv.innerHTML);
//<p>This is <em>my</em> content.</p>;
//獲取該div元素下的所有html代碼(包括所有空白符)
</script>
```
