查找HTML元素
為了做到這件事情求豫，你必須首先找到該元素蝙茶。有三種方法來做這件事：
- 通過 id 找到 HTML 元素
- 通過標(biāo)簽名找到 HTML 元素
- 通過類名找到 HTML 元素
通過id查找HTML節(jié)點(diǎn)元素
function myFunction()
{
var x=document.getElementById("intro");
}
通過標(biāo)簽名查找 HTML 元素
查找 id="main" 的元素歌馍，然后查找 "main" 中的所有標(biāo)簽為p的元素(是個數(shù)組)：
var x=document.getElementById("main");
var y=x.getElementsByTagName("p");
修改HTML元素：
修改元素內(nèi)容
將id為p1的元素展示內(nèi)容肢簿，修改為 "New text!"
document.getElementById("p1").innerHTML="New text!";
修改元素屬性
document.getElementById(id).attribute=new value僧凤，如下例豆巨，把id為image的src源文件路徑改為后面的剩辟。
document.getElementById("image").src="landscape.jpg";
修改元素CSS
公式：document.getElementById(id).style.property=new style
例如下面，將id為p2的元素的樣式顏色變?yōu)?藍(lán)色往扔。
document.getElementById("p2").style.color="blue";
JS交互
對事件做出反應(yīng)
我們可以在事件發(fā)生時執(zhí)行 JavaScript贩猎，比如當(dāng)用戶在 HTML 元素上點(diǎn)擊時。
如需在用戶點(diǎn)擊某個元素時執(zhí)行代碼萍膛，請向一個 HTML 事件屬性添加 JavaScript 代碼：
onclick=JavaScript
HTML 事件的例子：
- 當(dāng)用戶點(diǎn)擊鼠標(biāo)時
- 當(dāng)網(wǎng)頁已加載時
- 當(dāng)圖像已加載時
- 當(dāng)鼠標(biāo)移動到元素上時
- 當(dāng)輸入字段被改變時
- 當(dāng)提交 HTML 表單
onload 和 onunload 事件
onload 和 onunload 事件會在用戶進(jìn)入或離開頁面時被觸發(fā)吭服。
onload 事件可用于檢測訪問者的瀏覽器類型和瀏覽器版本，并基于這些信息來加載網(wǎng)頁的正確版本蝗罗。
onload 和 onunload 事件可用于處理 cookie艇棕。
onchange 事件
onchange 事件常結(jié)合對輸入字段的驗(yàn)證來使用。
下面是一個如何使用 onchange 的例子串塑。當(dāng)用戶改變輸入字段的內(nèi)容時沼琉，會調(diào)用 upperCase() 函數(shù)。
var x=document.getElementById("fname");
x.value=x.value.toUpperCase();
onmouseover和onmouseout事件
onmouseover 和 onmouseout 事件可用于在用戶的鼠標(biāo)移至 HTML 元素上方或移出元素時觸發(fā)函數(shù)桩匪。
onmousedown打瘪、onmouseup 以及 onclick 事件
onmousedown, onmouseup 以及 onclick 構(gòu)成了鼠標(biāo)點(diǎn)擊事件的所有部分。首先當(dāng)點(diǎn)擊鼠標(biāo)按鈕時吸祟，會觸發(fā) onmousedown 事件，當(dāng)釋放鼠標(biāo)按鈕時桃移，會觸發(fā) onmouseup 事件屋匕，最后，當(dāng)完成鼠標(biāo)點(diǎn)擊時借杰，會觸發(fā) onclick 事件过吻。
添加元素節(jié)點(diǎn)
如需向HTML DOM添加新元素，必須首先創(chuàng)建該元素（元素節(jié)點(diǎn)）蔗衡，然后向一個已存在的元素追加該元素纤虽。例如：
<div id="div1">
<p id="p1">這是一個段落</p>
<p id="p2">這是另一個段落</p>
</div>
<script>
var para=document.createElement("p");
var node=document.createTextNode("這是新段落。");
para.appendChild(node);
var element=document.getElementById("div1");
element.appendChild(para);
</script>
刪除元素
如需刪除 HTML 元素绞惦，你必須首先獲得該元素的父元素：
<div id="div1">
<p id="p1">這是一個段落逼纸。</p>
<p id="p2">這是另一個段落。</p>
</div>
<script>
var parent=document.getElementById("div1");
var child=document.getElementById("p1");
parent.removeChild(child);
</script>
如果能夠在不引用父元素的情況下刪除某個元素济蝉，就太好了杰刽。
不過很遺憾菠发。DOM 需要清楚你需要刪除的元素，以及它的父元素贺嫂。
這是常用的解決方案：找到你希望刪除的子元素滓鸠，然后使用其 parentNode 屬性來找到父元素：
var child=document.getElementById("p1");
child.parentNode.removeChild(child);
