1奈泪、解析過程
HTML加載完畢适贸，渲染引擎會在內(nèi)存中把HTML文檔，生成一個(gè)DOM樹涝桅，getElementById是獲取內(nèi)存中DOM上的元素節(jié)點(diǎn)拜姿，然后操作的時(shí)候 修改的是該元素的屬性，
2冯遂、DOM（文檔對象模型）
document是文檔對象模型的一部分
DOM是一個(gè)復(fù)合的數(shù)據(jù)類型
3蕊肥、DOM的數(shù)據(jù)結(jié)構(gòu)（樹狀）
4、HTML的組成部分為節(jié)點(diǎn)（Node）
在html當(dāng)中一切都是節(jié)點(diǎn)
每一個(gè)html標(biāo)簽都是一個(gè)元素節(jié)點(diǎn)蛤肌。（標(biāo)簽）
標(biāo)簽中的文字則是文字節(jié)點(diǎn)晴埂。（文本）
標(biāo)簽的屬性的屬性節(jié)點(diǎn)。（屬性）
5寻定、DOM節(jié)點(diǎn)的獲得
通過ID找到html元素
document.getElementById("id名稱");
通過標(biāo)簽名找到html元素
document.getElementsByTagName("div")
通過類名找到html元素
document.getElementsByClass("類名")儒洛；
標(biāo)簽數(shù)組= document.getElementsByTagName("div"); 通過標(biāo)簽名獲得標(biāo)簽數(shù)組
標(biāo)簽數(shù)組= document.getElementsByClassName("a");通過類名獲得標(biāo)簽數(shù)組
特殊情況：數(shù)組中的值只有1個(gè)。
document.getElementsByTagName("div")[0];取數(shù)組中第一個(gè)元素
document.getElementsByClassName("a")[0];取數(shù)組中第一個(gè)元素
6狼速、DOM訪問關(guān)系（節(jié)點(diǎn)的獲得）
節(jié)點(diǎn)的訪問關(guān)系琅锻，是以屬性的方式存在的。
DOM的節(jié)點(diǎn)并不是孤立的向胡，因此可以通過DOM節(jié)點(diǎn)之間的相對關(guān)系ui它們進(jìn)行訪問恼蓬。
7、父節(jié)點(diǎn)（parentNode）
調(diào)用者就是節(jié)點(diǎn)：一個(gè)節(jié)點(diǎn)只有一個(gè)父節(jié)點(diǎn)僵芹。調(diào)用方式就是節(jié)點(diǎn)parentode
8处硬、兄弟節(jié)點(diǎn)
Sibling:兄弟的意思
Next:下一個(gè)的意思
Previous:前一個(gè)的意思
nextSibling:調(diào)用者是節(jié)點(diǎn)。IE678中指一個(gè)元素節(jié)點(diǎn)（標(biāo)簽）拇派。在火狐谷歌IE9之后指的是下一個(gè)節(jié)點(diǎn)（包括空文檔和換行節(jié)點(diǎn)）荷辕。
nextElementSibling:在火狐谷歌IE9都指的是下一個(gè)元素節(jié)點(diǎn)凿跳。
總結(jié)：在IE678中用nextSibling，在火狐谷歌以后用nextElementSibling
下一個(gè)兄弟節(jié)點(diǎn)=節(jié)點(diǎn).nextElementSibling || 節(jié)點(diǎn).nextSibling
previouSibing:調(diào)用者是節(jié)點(diǎn)疮方。IE678中指前一個(gè)元素節(jié)點(diǎn)（標(biāo)簽）控嗜，在火狐谷歌IE9以后指的是前一個(gè)元素節(jié)點(diǎn)（包括空文檔和換行節(jié)點(diǎn)）
previousElementSibling:在火狐谷歌IE9都指的是前一個(gè)元素節(jié)點(diǎn)
總結(jié)：在IE678中用previousSibling，在火狐谷歌IE9+以后用previousElementSibling骡显。
下一個(gè)兄弟節(jié)點(diǎn)=節(jié)點(diǎn).previousElementSibling|| 節(jié)點(diǎn).previousSibling
9疆栏、單個(gè)子節(jié)點(diǎn)
firstChild:調(diào)用者是節(jié)點(diǎn)。IE678中指前一個(gè)元素節(jié)點(diǎn)（標(biāo)簽）惫谤，在火狐谷歌IE9以后指的是前一個(gè)元素節(jié)點(diǎn)（包括空文檔和換行節(jié)點(diǎn)）
firstElementChild:在火狐谷歌IE9都指的第一個(gè)元素節(jié)點(diǎn)壁顶。
第一個(gè)子節(jié)點(diǎn)=父節(jié)點(diǎn).firstElementChild || 父節(jié)點(diǎn).firstChild
lastChild:調(diào)用者是父節(jié)點(diǎn)。IE678中指最后一個(gè)子元素節(jié)點(diǎn)（標(biāo)簽）溜歪。在火狐谷歌IE9+以后都指的是最后一個(gè)節(jié)點(diǎn)（包括空文檔和換行節(jié)點(diǎn)）若专。
lastElementChild：在火狐谷歌IE9都指的最后一個(gè)元素節(jié)點(diǎn)。
第一個(gè)子節(jié)點(diǎn)=父節(jié)點(diǎn).lastElementChild|| 父節(jié)點(diǎn).lastChild
10痹愚、所有子節(jié)點(diǎn)
childNodes：它是標(biāo)準(zhǔn)屬性，它返回指定元素的子元素集合蛔糯，包括HTML節(jié)點(diǎn)拯腮，所有屬性，文本節(jié)點(diǎn) （他還是W3C的親兒子 ）
火狐 谷歌等高本版會把換行也看做是子節(jié)點(diǎn)
nodeType==1時(shí)才是元素節(jié)點(diǎn)(標(biāo)簽)
nodeType == 1 表示的是元素節(jié)點(diǎn) 記住 元素就是標(biāo)簽
nodeType == 2 表示是屬性節(jié)點(diǎn) 了解
nodeType == 3 是文本節(jié)點(diǎn) 了解
案例 ：
<!DOCTYPE html>
<html>
<head>
<meta charset="{CHARSET}">
<title></title>
</head>
<body>
<p id="demo">點(diǎn)我試試body元素節(jié)點(diǎn)的相關(guān)信息</p>
<button onclick="myFuntion()">試試就試試</button>
<script>
function myFunction(){
var txt="";
var c=document.body.childNodes;
for(i<0;i<c.length;i++){
txt=txt+c[i].nodeName+"<br>";
};
var x=document.getElementById("demo");
x.innerHTML=txt;
}
</script>
<p><b>注釋：</b>元素中的空格被視為文本蚁飒，而文本被視為節(jié)點(diǎn)动壤。</p>
</body>
</html>
children：非標(biāo)準(zhǔn)屬性，它返回指定元素的子元素集合淮逻。
但它只返回HTML節(jié)點(diǎn)琼懊，甚至不返回文本節(jié)點(diǎn)，雖然不是標(biāo)準(zhǔn)的DOM屬性爬早，但它和innerHTML方法一樣哼丈，得到了幾乎所有瀏覽器的支持。
children在IE6/7/8中包含注釋節(jié)點(diǎn)
在IE678中筛严，注釋節(jié)點(diǎn)不要寫在里面醉旦。
子節(jié)點(diǎn)數(shù)組 = 父節(jié)點(diǎn).children; 用的最多
節(jié)點(diǎn)自己.parentNode.children[index];隨意得到兄弟節(jié)點(diǎn)。
function siblings(elm) {
var a = [];
var p = elm.parentNode.children;
for(var i =0,pl= p.length;i<pl;i++) {
if(p[i] !== elm) a.push(p[i]);
}
return a;
}
定義一個(gè)函數(shù)桨啃。必須傳遞自己车胡。定義一個(gè)數(shù)組，獲得自己的父親照瘾，在獲得自己父親的所有兒子（包括自己）匈棘。遍歷所喲與的兒子，只要不是自己就放進(jìn)數(shù)組中析命。
DOM節(jié)點(diǎn)操作
節(jié)點(diǎn)的訪問關(guān)系都是屬性主卫。節(jié)點(diǎn)的操作都是函數(shù)或者方法逃默。
創(chuàng)建節(jié)點(diǎn)
使用方法是這樣的document.createElement();
新的標(biāo)簽（節(jié)點(diǎn)） = document.createElement(“標(biāo)簽名”);
插入節(jié)點(diǎn)
使用方法： 父節(jié)點(diǎn).appendChild();
父節(jié)點(diǎn).appendChild(新節(jié)點(diǎn)); 父節(jié)點(diǎn)的最后插入一個(gè)新節(jié)點(diǎn)
使用方法：父節(jié)點(diǎn).insertBefore(要插入的節(jié)點(diǎn)，參考節(jié)點(diǎn))队秩；
父節(jié)點(diǎn).insertBefore(新節(jié)點(diǎn),參考節(jié)點(diǎn))在參考節(jié)點(diǎn)前插入;
如果參考節(jié)點(diǎn)為null笑旺，那么他將在節(jié)點(diǎn)最后插入一個(gè)節(jié)點(diǎn)。
刪除節(jié)點(diǎn)
用法：用父節(jié)點(diǎn)刪除子節(jié)點(diǎn)馍资。
父節(jié)點(diǎn).removeChild（子節(jié)點(diǎn)）筒主；必須制定要刪除的子節(jié)點(diǎn)
節(jié)點(diǎn)自己刪除自己：
不知道父級的情況下，可以這么寫：node.parentNode.removeChild(node)
復(fù)制節(jié)點(diǎn)（ oldNode.cloneNode（true） ）
想要復(fù)制的節(jié)點(diǎn)調(diào)用這個(gè)函數(shù)cloneNode()鸟蟹，得到一個(gè)新節(jié)點(diǎn)乌妙。 方法內(nèi)部可以傳參，入股是true建钥，深層復(fù)制藤韵，如果是false，只復(fù)制節(jié)點(diǎn)本身熊经。
新節(jié)點(diǎn)=要復(fù)制的節(jié)點(diǎn).cloneNode(參數(shù)) ; 參數(shù)可選復(fù)制節(jié)點(diǎn)
用于復(fù)制節(jié)點(diǎn)泽艘， 接受一個(gè)布爾值參數(shù)， true 表示深復(fù)制（復(fù)制節(jié)點(diǎn)及其所有子節(jié)點(diǎn)）镐依， false 表示淺復(fù)制（復(fù)制節(jié)點(diǎn)本身匹涮，不復(fù)制子節(jié)點(diǎn)）
節(jié)點(diǎn)屬性
獲取：getAttribute(名稱)
設(shè)置：setAttribute(名稱, 值)
刪除：removeAttribute(名稱)
注意：IE6槐壳、7不支持然低。
調(diào)用者：節(jié)點(diǎn)。 有參數(shù)务唐。 沒有返回值雳攘。
