js操作節點,ID,name,calssname,tag,style

1.訪問節點
document.getElementById(id);
返回對擁有指定id的第一個對象進行訪問

document.getElementsByName(name);
返回帶有指定名稱的節點集合
注意:Elements

document.getElementsByTagName(tagname);
返回帶有指定標籤名的對象集合
注意:Elements

document.getElementsByClassName(classname);
返回帶有指定class名稱的對象集合
注意:Elements

2.生成節點
document.createElement(eName);
創建一個節點

document.createAttribute(attrName);
對某個節點創建屬性

document.createTextNode(text);
創建文本節點

3.添加節點
document.insertBefore(newNode,referenceChild);
在某個節點前插入節點

parentNode.appendChild(newNode);
給某個節點添加子節點

4.複製節點
cloneNode(true | false);
複製某個節點
參數:是否複製原節點的所有屬性

5.刪除節點
parentNode.removeChild(node)
刪除某個節點的子節點
node是要刪除的節點
注意:IE會忽略節點間生成的空白文本節點(例如,換行符號),而Mozilla不會這樣做。在刪除指定節點的時候不會出錯,但是如果要刪除最後一個子結點或者是第一個子結點的時候,就會出現問題。這時候,就需要用一個函數來判斷首個子結點的節點類型。
元素節點的節點類型是 1,因此如果首個子節點不是一個元素節點,它就會移至下一個節點,然後繼續檢查此節點是否爲元素節點。整個過程會一直持續到首個元素子節點被找到爲止。通過這個方法,我們就可以在 Internet Explorer 和 Mozilla 得到正確的方法。

6.修改文本節點
appendData(data);
將data加到文本節點後面

deleteData(start,length);
將從start處刪除length個字符

insertData(start,data)
在start處插入字符,start的開始值是0;

replaceData(start,length,data)
在start處用data替換length個字符

splitData(offset)
在offset處分割文本節點

substringData(start,length)
從start處提取length個字符

7.屬性操作
getAttribute(name)
通過屬性名稱獲取某個節點屬性的值

setAttribute(name,value);
修改某個節點屬性的值

removeAttribute(name)
刪除某個屬性

8.查找節點
parentObj.firstChild
如果節點爲已知節點的第一個子節點就可以使用這個方法。此方法可以遞歸進行使用
parentObj.firstChild.firstChild.....

parentObj.lastChild
獲得一個節點的最後一個節點,與firstChild一樣也可以進行遞歸使用
parentObj.lastChild.lastChild.....

parentObj.childNodes
獲得節點的所有子節點,然後通過循環和索引找到目標節點

9.獲取相鄰的節點
neborNode.previousSibling :獲取已知節點的相鄰的上一個節點
nerbourNode.nextSlbling: 獲取已知節點的下一個節點

10.獲取父節點
childNode.parentNode:得到已知節點的父節點



發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章