[b]dom結構[/b]——兩個節點之間可能存在哪些關係以及如何在節點之間任意移動?
document.documentelement 返回文件的根節點
document.body
document.activeelement 返回當前文件中被擊活的標籤節點(ie)
event.fromelement 返回滑鼠移出的源節點(ie)
event.toelement 返回滑鼠移入的源節點(ie)
event.srcelement 返回啟用事件的源節點(ie)
event.target 返回啟用事件的源節點(firefox)
[b]當前物件為node:[/b]
返回父節點:node.parentnode, node.parendelement(ie)
返回所有子節點:node.childnodes(包含文字節點及標籤節點),node.children
返回第乙個子節點:node.firstchild
返回最後乙個子節點: node.lastchild
parentnode和parentelement功能一樣,childnodes和children功能一樣。但是parentnode和 childnodes是符合w3c標準的,可以說比較通用。而另外兩個只是ie支援,不是標準,firefox 就不支援,所以大家只要記得有parentelement和children就行了
[b]節點的操作:[/b]
建立節點: document.createelement("div");//好像大都只能用document,不知道還能換成什麼
建立節點: document.createtextnode("fdsafdas");
[b]常用的新增節點:[/b]
pnode.insertbefore(newchild, oldchild);//在現有的子節點前插入乙個新的子節點
[b]刪除節點:[/b] pnode.removechild(node)
[b]複製節點:[/b] pnode.clonenode(include_all); //include_all為true時,則同時複製所有子節點,為false時,則只複製該節點(注意id也會被複製)
[b]替換節點:[/b] pnode.replacechild(newnode,oldchild)
[b]訪問節點:[/b]
訪問html元素:var ohtml=document.documentelement;
獲取head元素:var ohead=ohtml.firstchild;
獲取body元素:var obody=ohtml.lastchild; 或者 var obody=document.body;
也可以通過childnodes來做同樣的工作:
var ohead=ohtml.childnodes[0] 或者 ohtml.childnodes.item(0);
var obody=ohtml.childnodes[1] 或者 ohtml.childnodes.item(1);
[b]判斷節點間關係:[/b]
alert(ohead.parentnode==ohtml);
alert(obody.previoussibling==ohead);
alert(ohead.nextsibling==obody);
alert(ohead.ownerdocument==document);
[b]訪問指定節點:[/b]
熟知的getelementsbytagname(name),getelementsbyname(name),getelementbyid(id)三個方法,不再展開。
[b]屬性操作:[/b]
getattribute(name) ——返回名稱為name的屬性的值
setattribute(name,value) ——顧名思義
removeattribute(name) ——顧名思義
為了簡化建立**,html dom提供了一系列的**方法,常用幾個:
cells ——返回元素中的所有單元格
rows ——**中所有行的集合
insertrow(position) ——在rows集合中指定位置插入新行
deleterow(position) ——與insertrow相反
insertcell(position) ——在cells集合的指定位置插入乙個新的單元格
deletecell(position) ——與insertcell相反
DOM常用方法總結
getelementsbyname 尋找有著給定name屬性的所有元素,這個方法將返回乙個節點集合,這個集合可以當作乙個陣列來處理。這個集合的length屬性等於當前文件裡有著給定name屬性的所有元素的總個數。getelementsbytagname 尋找有著給定標籤名的所有元素,這個方法將返回乙...
dom中classList物件常用方法
新增新的類名,如已經存在,取消新增 classlist.add newclassname varstr document.getelementbyid str str.classlist.add newclassname 確定元素中是否包含指定的類名,返回值為true false classlist...
js Array物件的常用方法總結
一 檢測陣列 array.isarray 確定某個值是不是陣列 var arr 1,2,3 array.isarray arr true二 轉換方法 1.tostring 返回由陣列中每個值的字串形式拼接而成的乙個以逗號分隔的字串 2.valueof 返回陣列本身 var colors red bl...