原生JS實(shí)現(xiàn)循環(huán)Nodelist Dom列表的4種方式示例
更新時(shí)間：2018年02月11日 10:35:52 作者：qiaolevip
這篇文章主要介紹了原生JS實(shí)現(xiàn)循環(huán)Nodelist Dom列表的4種方式,結(jié)合具體實(shí)例形式分析了javascript循環(huán)遍歷Nodelist Dom列表的常用操作技巧,需要的朋友可以參考下
本文實(shí)例講述了原生JS實(shí)現(xiàn)循環(huán)Nodelist Dom列表的4種方式。分享給大家供大家參考，具體如下：
function $(id) {
return document.getElementById(id);
}
var _PAGE = {
timeListDom: $('timeList')
};
var spanDoms = _PAGE.timeListDom.querySelectorAll('span'), domLen = spanDoms.length;
// 第一種方式：原生for循環(huán)
for (var i = 0; i < domLen; i++) {
var v = spanDoms[i];
// do something you want deal with DOM
}
// 第二種方式：Array 的 forEach函數(shù)
Array.prototype.forEach.call(spanDoms, function(v) {
// do something you want deal with DOM
});
// 第三種方式：Array 的 forEach函數(shù)
[].forEach.call(spanDoms, function(el) {
// do something you want deal with DOM
el.classList.remove('active');
});
// 第四種方式：繼承Array 的 forEach函數(shù)
NodeList.prototype.forEach = Array.prototype.forEach;
spanDoms.forEach(function(v) {
// do something you want deal with DOM
});
更多關(guān)于JavaScript相關(guān)內(nèi)容感興趣的讀者可查看本站專題：《JavaScript操作DOM技巧總結(jié)》、《JavaScript錯(cuò)誤與調(diào)試技巧總結(jié)》、《JavaScript數(shù)據(jù)結(jié)構(gòu)與算法技巧總結(jié)》、《JavaScript遍歷算法與技巧總結(jié)》及《JavaScript數(shù)學(xué)運(yùn)算用法總結(jié)》
希望本文所述對(duì)大家JavaScript程序設(shè)計(jì)有所幫助。
相關(guān)文章
javascript驗(yàn)證香港身份證的格式或真實(shí)性
本文分享了利用javascript驗(yàn)證香港身份證的格式或真實(shí)性的代碼，具有很好的參考價(jià)值，下面跟著小編一起來(lái)看下吧2017-02-02
svg插入foreignObject無(wú)法響應(yīng)事件解決
這篇文章主要為大家介紹了svg插入foreignObject無(wú)法響應(yīng)事件解決,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪2023-10-10
實(shí)例分析js類中的公有和私有變量2008-07-07
詳解JavaScript中扁平與樹(shù)形數(shù)據(jù)的轉(zhuǎn)換
這篇文章主要為大家想介紹了JavaScript中實(shí)現(xiàn)扁平與樹(shù)形數(shù)據(jù)相互轉(zhuǎn)換的方法，文中的示例代碼講解詳細(xì)，對(duì)我們學(xué)習(xí)JavaScript有一定的幫助，需要的可以參考一下2023-01-01
淺談layer的iframe彈窗給里面的標(biāo)簽賦值的問(wèn)題
下面小編就為大家?guī)?lái)一篇淺談layer的iframe彈窗給里面的標(biāo)簽賦值的問(wèn)題。小編覺(jué)得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2016-11-11
這篇文章主要為大家詳細(xì)介紹了Ionic2開(kāi)發(fā)環(huán)境的搭建教程，文中步驟介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2017-06-06
Auntion-TableSort國(guó)人寫(xiě)的一個(gè)javascript表格排序的東西
Auntion-TableSort國(guó)人寫(xiě)的一個(gè)javascript表格排序的東西...2007-11-11
JS數(shù)組的遍歷方式for循環(huán)與for...in
本節(jié)主要介紹了JS數(shù)組的遍歷方式for循環(huán)與for...in,需要的朋友可以參考下2014-07-07
這篇文章主要介紹了javascript 數(shù)組操作詳解,需要的朋友可以參考下2015-01-01
JavaScript中textRange對(duì)象使用方法小結(jié)
這篇文章主要介紹了JavaScript中textRange對(duì)象使用方法小結(jié),需要的朋友可以參考下2015-03-03