JavaScript原生節(jié)點操作小結(jié)
前言:原生是Javascript的基礎(chǔ),還是需要多多重視,時間長都忘記了,現(xiàn)在整理一下。
獲取子節(jié)點
children 不是標(biāo)準(zhǔn)的dom屬性,但是幾乎被所有瀏覽器支持。不包含文本節(jié)點.
注意:在IE中,children包含注釋節(jié)點。
childNodes 是標(biāo)準(zhǔn)屬性。返回所有子節(jié)點。包括文本節(jié)點。
獲取第一個子節(jié)點
1.firstChild
document.getElementById('b_pole').childNodes[0].childNodes[0].firstChild
獲取最后一個子節(jié)點
1.lastChild
document.getElementById('b_pole').childNodes[0].childNodes[0].lastChild
判斷是否有子節(jié)點
1.hasChildNodes()
document.getElementById('b_pole').childNodes[0].childNodes[0].hasChildNodes()
判斷節(jié)點類型與節(jié)點名稱
1.nodeType
1:元素
2:屬性
3:文本
2.nodeName
document.getElementById('b_pole').childNodes[0].childNodes[0].nodeType //1 document.getElementById('b_pole').childNodes[0].childNodes[0].nodeName //UL
創(chuàng)建DOM結(jié)構(gòu)
1.創(chuàng)建元素節(jié)點 createElement
2.創(chuàng)建文本節(jié)點 createTextNode
document.createElement('div') document.createTextNode('ok')
插入節(jié)點
1.insertBefore
2.appendChild
document.getElementById('b_pole').insertBefore(document.createTextNode('div'),document.getElementById('b_pole').firstChild)
document.getElementById('b_tween').childNodes[0].nextSibling.previousSibling.appendChild(document.createTextNode('ZQZQZQZQZ'))
移除節(jié)點
1.removeChild
document.getElementById('b_pole').removeChild(document.getElementById('b_pole').childNodes[0])
并返回被刪除的節(jié)點dom
獲取元素的下一個節(jié)點(同胞)
1.nextSibling
document.getElementById('b_pole').nextSibling
獲取元素的上一個節(jié)點(同胞)
1.previousSibling
document.getElementById('b_pole').previousSibling
以上就是本文的全部內(nèi)容,希望本文的內(nèi)容對大家的學(xué)習(xí)或者工作能帶來一定的幫助,同時也希望多多支持腳本之家!
- JavaScript DOM節(jié)點操作方法總結(jié)
- Javascript的各種節(jié)點操作實例演示代碼
- JavaScript 節(jié)點操作 以及DOMDocument屬性和方法
- js操作DOM--添加、刪除節(jié)點的簡單實例
- JavaScript操作HTML DOM節(jié)點的基礎(chǔ)教程
- JavaScript節(jié)點及列表操作實例小結(jié)
- Js操作樹節(jié)點自動折疊展開的幾種方法
- 使用js完成節(jié)點的增刪改復(fù)制等的操作
- js和jquery對dom節(jié)點的操作(創(chuàng)建/追加)
- javascript學(xué)習(xí)筆記(十九) 節(jié)點的操作實現(xiàn)代碼
- javascript dom操作之cloneNode文本節(jié)點克隆使用技巧
相關(guān)文章
JS控件autocomplete 0.11演示及下載 1月5日已更新
JS控件autocomplete 0.11演示及下載 1月5日已更新...2007-01-01JS實現(xiàn)可自定義大小,可雙擊關(guān)閉的彈出層效果
這篇文章主要介紹了JS實現(xiàn)可自定義大小,可雙擊關(guān)閉的彈出層效果,涉及JavaScript定時函數(shù)及頁面元素動態(tài)操作的相關(guān)技巧,具有一定參考借鑒價值,需要的朋友可以參考下2015-10-10將\u8BF7\u9009\u62E9 這樣的字符串轉(zhuǎn)為漢字的代碼
如何把 \u8BF7\u9009\u62E9 這樣的字符串轉(zhuǎn)為漢字,喜歡的朋友可以參考下。2010-11-11javascript 實現(xiàn)雙擊才能打開鏈接的方法
javascript 實現(xiàn)雙擊才能打開鏈接的方法...2007-08-08解決bootstrap模態(tài)框數(shù)據(jù)緩存的問題方法
今天小編就為大家分享一篇解決bootstrap模態(tài)框數(shù)據(jù)緩存的問題方法,具有很好的參考價值,希望對大家有所幫助。一起跟隨小編過來看看吧2018-08-08