js操作dom節點
1.訪問節點
document.getelementbyid(id);
返回對擁有指定id的第乙個物件進行訪問
document.getelementsbyname(name);
返回帶有指定名稱的節點集合
注意:element
sdocument.getelementsbytagname(tagname);
返回帶有指定標籤名的物件集合
注意：elements
document.getelementsbyclassname(classname);
返回帶有指定class名稱的物件集合
注意：elements
2.生成節點
document.createelement(ename);
建立乙個節點
document.createattribute(attrname);
對某個節點建立屬性
document.createtextnode(text);
建立文字節點
3.新增節點
document.insertbefore(newnode,referencechild);
在某個節點前插入節點
4.複製節點
clonenode(true | false);
複製某個節點
引數：是否複製原節點的所有屬性
5.刪除節點
parentnode.removechild(node)
刪除某個節點的子節點
node是要刪除的節點
注意：ie會忽略節點間生成的空白文字節點
(例如，換行符號)，而
mozilla
不會這樣做。在刪除指定節點的時候不會出錯，但是如果要刪除最後乙個子結點或者是第乙個子結點的時候，就會出現問題。這時候，就需要用乙個函式來判斷首個子結點的節點型別。
元素節點的節點型別是 1，因此如果首個子節點不是乙個元素節點，它就會移至下乙個節點，然後繼續檢查此節點是否為元素節點。整個過程會一直持續到首個元素子節點被找到為止。通過這個方法，我們就可以在
internet explorer
和 mozilla
得到正確的方法。
6.修改文字節點
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)
刪除某個屬性
< head>
html dom
< /head>
< body οnlοad="load_message();">
< /body>
< /html>
8.查詢節點
parentobj.firstchild
如果節點為已知節點的第乙個子節點就可以使用這個方法。此方法可以遞迴進行使用
parentobj.firstchild.firstchild.....
parentobj.lastchild
獲得乙個節點的最後乙個節點，與firstchild一樣也可以進行遞迴使用
parentobj.lastchild.lastchild.....
parentobj.childnodes
獲得節點的所有子節點，然後通過迴圈和索引找到目標節點
9.獲取相鄰的節點
nebornode.previoussibling :獲取已知節點的相鄰的上乙個節點
nerbournode.nextslbling: 獲取已知節點的下乙個節點
10.獲取父節點
childnode.parentnode:得到已知節點的父節點
11替換節點 方法
常見DOM操作
建立元素節點 var odiv document.createelement div 建立乙個div var op document.createelement p 建立乙個p標籤建立文字節點 var otext document.createtextnode 文字資訊 把建立的節點追加到方法呼叫者...
常見的dom操作
p標籤 查 查詢dom節點 查詢元素節點p的屬性返回屬性名稱對應的屬性值 ipt attr title 返回p的屬性title的值。var ipt ipt attr title console.log ipt 20 建 新建dom節點 建立元素節點並且把節點作為元素的子節點新增到dom節點樹上。先建...
JS常見的DOM操作API
目錄 幾種物件 node nodelist htmlcollection 節點查詢api 節點建立api createelement createtextnode clonenode createdocumentfragment 節點修改api insertbefore removechild re...