1.獲取DOM節(jié)點(diǎn)

document.getElementById();   //通過(guò)ID獲取
document.getElementsByTagName();   //通過(guò)標(biāo)簽名獲取
document.getElementsByClassName();   //通過(guò)類(lèi)名獲取

document.getElementsByTagName();document.getElementsByClassName();總是返回一組DOM節(jié)點(diǎn)。要精確地選擇DOM，可以先定位父節(jié)點(diǎn)，再?gòu)母腹?jié)點(diǎn)開(kāi)始選擇，以縮小范圍。
querySelector();和querySelectorAll();
2.插入DOM

• innerHTML屬性，不但可以修改一個(gè)DOM節(jié)點(diǎn)的文本內(nèi)容，還可以直接通過(guò)HTML片段修改DOM節(jié)點(diǎn)內(nèi)部的子樹(shù)
  若DOM節(jié)點(diǎn)是空的，可通過(guò)innerHTML="<span>child</span>";
• appendChild()
  可通過(guò)appendChild()，把一個(gè)子節(jié)點(diǎn)添加到父節(jié)點(diǎn)的最后一個(gè)子節(jié)點(diǎn)。

<!-- HTML結(jié)構(gòu) -->
<div id="list">
    <p id="java">Java</p>
    <p id="python">Python</p>
    <p id="scheme">Scheme</p>
    <p id="js">JavaScript</p>
</div>
<!-- JS -->
var
    list = document.getElementById('list'),
    haskell = document.createElement('p');  //創(chuàng)建一個(gè)p標(biāo)簽
haskell.id = 'haskell';
haskell.innerText = 'Haskell';   //插入文本內(nèi)容
list.appendChild(haskell);

• insertBefore()
parentElement.insertBefore(newElement, referenceElement);，新子節(jié)點(diǎn)會(huì)插入到referenceElement之前。
• innerText或textContent屬性，這樣可以自動(dòng)對(duì)字符串進(jìn)行HTML編碼，保證無(wú)法設(shè)置任何HTML標(biāo)簽
  innerText不返回隱藏元素的文本，而textContent返回所有文本
• 設(shè)置CSS屬性 font-size等設(shè)置為fontSize

3.刪除DOM
要?jiǎng)h除一個(gè)節(jié)點(diǎn)，首先要獲得該節(jié)點(diǎn)本身以及它的父節(jié)點(diǎn)，然后，調(diào)用父節(jié)點(diǎn)的removeChild()把自己刪掉。

// 拿到待刪除節(jié)點(diǎn):
var self = document.getElementById('to-be-removed');
// 拿到父節(jié)點(diǎn):
var parent = self.parentElement;
// 刪除:
var removed = parent.removeChild(self);
removed === self; // true

children屬性是一個(gè)只讀屬性，并且它在子節(jié)點(diǎn)變化時(shí)會(huì)實(shí)時(shí)更新