新聞中心
你對(duì)遍歷DOM的概念是否了解,本文向大家描述一下,遍歷DOM就是用來(lái)描述訪問(wèn)整個(gè)DOM尋找節(jié)點(diǎn)的行為,DOM接口為我們提供了大量的節(jié)點(diǎn)屬性以便我們?cè)谖臋n中的所有節(jié)點(diǎn)自由訪問(wèn)。

創(chuàng)新互聯(lián)公司是一家網(wǎng)站設(shè)計(jì)公司,集創(chuàng)意、互聯(lián)網(wǎng)應(yīng)用、軟件技術(shù)為一體的創(chuàng)意網(wǎng)站建設(shè)服務(wù)商,主營(yíng)產(chǎn)品:成都響應(yīng)式網(wǎng)站建設(shè)公司、成都品牌網(wǎng)站建設(shè)、成都全網(wǎng)營(yíng)銷。我們專注企業(yè)品牌在網(wǎng)站中的整體樹(shù)立,網(wǎng)絡(luò)互動(dòng)的體驗(yàn),以及在手機(jī)等移動(dòng)端的優(yōu)質(zhì)呈現(xiàn)。網(wǎng)站設(shè)計(jì)、做網(wǎng)站、移動(dòng)互聯(lián)產(chǎn)品、網(wǎng)絡(luò)運(yùn)營(yíng)、VI設(shè)計(jì)、云產(chǎn)品.運(yùn)維為核心業(yè)務(wù)。為用戶提供一站式解決方案,我們深知市場(chǎng)的競(jìng)爭(zhēng)激烈,認(rèn)真對(duì)待每位客戶,為客戶提供賞析悅目的作品,網(wǎng)站的價(jià)值服務(wù)。
遍歷DOM
術(shù)語(yǔ)'遍歷DOM”就是用來(lái)描述訪問(wèn)整個(gè)DOM尋找節(jié)點(diǎn)的行為。DOM接口為我們提供了大量的節(jié)點(diǎn)屬性以便我們?cè)谖臋n中的所有節(jié)點(diǎn)自由訪問(wèn)。這些節(jié)點(diǎn)屬性可以方便我們?cè)L問(wèn)關(guān)聯(lián)的/挨著的節(jié)點(diǎn):
Node.childNodes:你可以使用它訪問(wèn)某個(gè)元素的所有直屬子元素。它將返回一個(gè)類似數(shù)組的對(duì)象,你可以循環(huán)遍歷它。數(shù)組中的節(jié)點(diǎn)可以包含所有不同類型的節(jié)點(diǎn),如文本節(jié)點(diǎn)和其它類型的元素節(jié)點(diǎn)。
◆Node.firstChild:這個(gè)屬性等同于訪問(wèn)’childNodes’數(shù)組的首項(xiàng)(‘Element.childNodes[0]‘)。它是個(gè)捷徑。
◆Node.lastChild:這個(gè)屬性等同于訪問(wèn)’childNodes’數(shù)組的末項(xiàng)(‘Element.childNodes[Element.childNodes.length-1]‘)。它也是個(gè)捷徑。
◆Node.parentNode:這個(gè)屬性可以讓你訪問(wèn)當(dāng)前節(jié)點(diǎn)的父節(jié)點(diǎn),僅會(huì)有唯一一個(gè)父節(jié)點(diǎn),如果想訪問(wèn)’祖父’級(jí)節(jié)點(diǎn),可以使用’Node.parentNode.parentNode’,以此類推。
◆Node.nextSibling:這個(gè)屬性可以讓你訪問(wèn)DOM樹(shù)同級(jí)下的下一個(gè)節(jié)點(diǎn)。
◆Node.previousSibling:這個(gè)屬性可以讓你訪問(wèn)DOM樹(shù)同級(jí)下的上一個(gè)節(jié)點(diǎn)。
所以就想你看到的一樣,遍歷DOM就是如此簡(jiǎn)單,只要你熟練運(yùn)用了他的那些節(jié)點(diǎn)屬性。
列表項(xiàng)只能在他們之間沒(méi)有空格的情況下檢索。因?yàn)樵谖臋n中你能得到文本節(jié)點(diǎn)和元素節(jié)點(diǎn),而’
- ’和’
- ’之間的空格也會(huì)被當(dāng)做是一個(gè)節(jié)點(diǎn)(文本節(jié)點(diǎn))。同樣,無(wú)序列表嚴(yán)格意義上講并不是段落的下一個(gè)兄弟節(jié)點(diǎn),因?yàn)樵谒麄z之間有空格,也就是另一個(gè)節(jié)點(diǎn)。通常在這種情況下,你可以遍歷’childNodes’數(shù)組并測(cè)試它們的’nodeType’,'nodeType’值為1就是元素節(jié)點(diǎn),2為屬性,3為文本節(jié)點(diǎn)。
這就是JavaScript基本運(yùn)行方式,你可以使用本地DOM方法和屬性漂亮的訪問(wèn)并提取文檔中的元素?,F(xiàn)在你可以脫離那些繁瑣的框架而獨(dú)立進(jìn)行基本的DOM操作了。
【編輯推薦】
- 深入學(xué)習(xí)JavaScript DOM遍歷方法
- 淺析Javascript Dom編程
- JavaScript獲取HTML DOM節(jié)點(diǎn)元素詳解
- JavaScript和DOM輕松實(shí)現(xiàn)數(shù)據(jù)訪問(wèn)
- HTML DOM與XML DOM的區(qū)別與聯(lián)系探究
當(dāng)前標(biāo)題:學(xué)習(xí)筆記如何遍歷DOM?
瀏覽地址:http://www.dlmjj.cn/article/dhoccgi.html


咨詢
建站咨詢
