為了方便使用，下面的例子中全部都是用ul li 來寫的
1、getElementsByTagName("") 獲取標(biāo)簽四瘫，得到的是類數(shù)組，并不是真正意義上的數(shù)組
2插掂、getElementsByClassName("") 同上
3、getAttribute("屬性");
獲取屬性腥例，因為屬性是存在于標(biāo)簽里辅甥，一般需要先獲取標(biāo)簽，
document.getElementsByTagName("a")[0]
4燎竖、setAttribute（"屬性"璃弄，要設(shè)置的內(nèi)容)；
element.setAttribute(attributename,attributevalue)
這里的屬性一般遇見的有src构回、href谢揪、title、target
5捐凭、childNodes 獲取的是所有子節(jié)點，其中也包括文本節(jié)點和元素節(jié)點凳鬓。
奇怪的是它在IE6-8使用是不存在問題茁肠，但是在其他瀏覽器里會有問題，因此
我們會用【nodeType】來判斷節(jié)點類型缩举，舉個例子
var oUl=document.getElementById("ul1");
for(var i=0;i<oUl.childNodes.length;i++){
? ? ? ?if(oUl.childNodes[i].nodeType ==1){
? ? ? ? ? ? oUl.childNodes[i].style.background="green"
? ? ? ? ?}
}
第一個元素節(jié)點
第二個元素節(jié)點
第三個元素節(jié)點
我們需要知道如果 nodeType ==3,它表示的是文本節(jié)點垦梆，而文本節(jié)點是無法加樣式的；
如果nodeType ==1仅孩，則是元素節(jié)點托猩，而我們也只要元素節(jié)點，所以在循環(huán)里加判斷辽慕，就不會存在兼容問題京腥。
當(dāng)然，我們可以使用【children】,它僅僅獲取的是元素節(jié)點溅蛉，在高版本瀏覽器或IE瀏覽器下都可以使用公浪，所以上述例子中直接把childNode改成children就可以了，也不需要給其加判斷船侧，所以建議直接用children欠气。
6、firstChild????獲取的是第一個子節(jié)點镜撩，這個如果直接使用也存在兼容問題预柒，它適用于IE6--8，所以一般在高版本瀏覽器下使用的是：firstElementChild。同樣的使用時宜鸯，需要加個判斷憔古，還是舉例：
var oUl=document.getElementById("ul1");
if(oUl.firstElementChild){
? ? ? ? // 適配高版本瀏覽器
? ? ? oUl.firstElementChild.style.background="red"
}else{
? ? ?// IE6-8適用
? ? ?oUl.firstChild.style.background="red"
}
同理肯定還有l(wèi)astChild/lastElementChild,用法一樣。
7顾翼、parerntNode??獲取父節(jié)點
?寫法為：子元素.parerntNode
*offsetParent??它也可以獲取父節(jié)點投放，它有一定的局限性，因為如果改變了定位的樣式适贸，那么獲取到的父節(jié)點就會不一樣灸芳，比如父節(jié)點去掉定位，那么子元素的父節(jié)點就會往上一級去找拜姿， 寫法還是一樣的：子元素.offsetParent烙样。
8、nextSibling 獲取兄弟節(jié)點蕊肥，這個一般在IE下可執(zhí)行
為了兼容谷歌谒获，寫法為：nextElementSibling;
var Oli = document.getElementsByTagName("li")
for(var i=0;i<Oli.length;i++){
? ? ?Oli[i].onclick = function(){
? ? ? ? ?if(this.nextElementSibling){
? ? ? ? ? ? // 為了兼容谷歌
? ? ? ? ? alert(this.nextElementSibling.innerText)
? ? }else{
? ? ? ? alert(this.nextSibling.innerText)
? ? ? ?}
? }
}
9、createElement????創(chuàng)建節(jié)點/createTextNode????創(chuàng)建文本內(nèi)容/createDocumentFragment 文檔碎片/insertBefore 在父級元素里的某個位置插入新創(chuàng)建的子元素
var oli = document.createElement("li"); 創(chuàng)建li標(biāo)簽
oli.innerText="this is new li" ;??給li標(biāo)簽添加文本內(nèi)容
obox.appendChild(oli)
10壁却、removeChild 移除子節(jié)點
移除子節(jié)點肯定得有父節(jié)點批狱，所以要先獲取父節(jié)點，然后獲取要刪除的每個子節(jié)點展东，最后實現(xiàn)的就是在父節(jié)點里刪除子節(jié)點赔硫，下面的例子中要刪除的肯定是li,但是我們獲取的是每個a,所以還要再獲取a的父節(jié)點，用parentNode獲取到li
var obox = document.getElementById("box");
var oa = document.getElementsByTagName("a");
for(var i=0;i<oa.length;i++){
? ? ? oa[i].onclick = function(){
? ? ? ? ? obox.removeChild(this.parentNode)
? ? ? }
}
第一個
第二個
第三個
