js節(jié)點(diǎn)操作
1.訪問節(jié)點(diǎn)
document.getElementById(id);
返回對(duì)擁有指定id的第一個(gè)對(duì)象進(jìn)行訪問
document.getElementsByName(name);
返回帶有指定名稱的節(jié)點(diǎn)集合
document.getElementsByTagName(tagname);
返回帶有指定標(biāo)簽名的對(duì)象集合
document.getElementsByClassName(classname);
返回帶有指定class名稱的對(duì)象集合
2.生成節(jié)點(diǎn)
document.createElement(eName);
創(chuàng)建一個(gè)節(jié)點(diǎn)
document.createAttribute(attrName);
對(duì)某個(gè)節(jié)點(diǎn)創(chuàng)建屬性
document.createTextNode(text);
創(chuàng)建文本節(jié)點(diǎn)
3.添加節(jié)點(diǎn)
document.insertBefore(newNode,referenceChild);
在某個(gè)節(jié)點(diǎn)前插入節(jié)點(diǎn)
parentNode.appendChild(newNode);
給某個(gè)節(jié)點(diǎn)添加子節(jié)點(diǎn)
4.復(fù)制節(jié)點(diǎn)
cloneNode(true | false);
復(fù)制某個(gè)節(jié)點(diǎn)
參數(shù)：是否復(fù)制原節(jié)點(diǎn)的所有屬性
5.刪除節(jié)點(diǎn)
parentNode.removeChild(node)
刪除某個(gè)節(jié)點(diǎn)的子節(jié)點(diǎn)
6.修改文本節(jié)點(diǎn)
appendData(data);
將data加到文本節(jié)點(diǎn)后面
deleteData(start,length);
將從start處刪除length個(gè)字符
insertData(start,data)
在start處插入字符,start的開始值是0;
replaceData(start,length,data)
在start處用data替換length個(gè)字符
splitData(offset)
在offset處分割文本節(jié)點(diǎn)
substringData(start,length)
從start處提取length個(gè)字符
7.屬性操作
getAttribute(name)
通過屬性名稱獲取某個(gè)節(jié)點(diǎn)屬性的值
setAttribute(name,value);
修改某個(gè)節(jié)點(diǎn)屬性的值
removeAttribute(name)
?
8.查找節(jié)點(diǎn)
parentObj.firstChild
如果節(jié)點(diǎn)為已知節(jié)點(diǎn)的第一個(gè)子節(jié)點(diǎn)就可以使用這個(gè)方法滑进。此方法可以遞歸進(jìn)行使用
parentObj.firstChild.firstChild.....
parentObj.lastChild
獲得一個(gè)節(jié)點(diǎn)的最后一個(gè)節(jié)點(diǎn)募判，與firstChild一樣也可以進(jìn)行遞歸使用
parentObj.lastChild.lastChild.....
parentObj.childNodes
獲得節(jié)點(diǎn)的所有子節(jié)點(diǎn)，然后通過循環(huán)和索引找到目標(biāo)節(jié)點(diǎn)
9.獲取相鄰的節(jié)點(diǎn)
neborNode.previousSibling :獲取已知節(jié)點(diǎn)的相鄰的上一個(gè)節(jié)點(diǎn)
nerbourNode.nextSlbling: 獲取已知節(jié)點(diǎn)的下一個(gè)節(jié)點(diǎn)
10.獲取父節(jié)點(diǎn)
childNode.parentNode:得到已知節(jié)點(diǎn)的父節(jié)點(diǎn)
11替換節(jié)點(diǎn) 方法replace(new,old)
? ? ? function replaceMessage()
? ? ? {
? ? ? var oNewp=document.createElement("p");
? ? ? var oText=document.createTextNode("World Hello");
? ? ? oNewp.appendChild(oText);
? ? ? var oOldp=document.body.getElementsByTagName("p")[0];
? ? ? oOldp.parentNode.replaceChild(oNewp,oOldp);
? ? ? }
? ? ?
hello world!
?
?
