Heim  >  Artikel  >  Web-Frontend  >  So implementieren Sie eine Schleifen-Nodelist-Dom-Liste mit JS

So implementieren Sie eine Schleifen-Nodelist-Dom-Liste mit JS

亚连
亚连Original
2018-06-06 10:20:512395Durchsuche

In diesem Artikel werden hauptsächlich vier Möglichkeiten zum Implementieren einer Schleife in der Nodelist-Dom-Liste in nativem JS vorgestellt und die gängigen Operationstechniken der Javascript-Schleife durch die Nodelist-Dom-Liste anhand spezifischer Beispiele analysiert

Die Beispiele in diesem Artikel beschreiben vier Möglichkeiten zum Implementieren einer Schleifen-Nodelist-Dom-Liste in nativem JS. Teilen Sie es als Referenz mit allen. Die Details lauten wie folgt:

function $(id) {
 return document.getElementById(id);
}
var _PAGE = {
 timeListDom: $('timeList')
};
var spanDoms = _PAGE.timeListDom.querySelectorAll('span'), domLen = spanDoms.length;
// 第一种方式:原生for循环
for (var i = 0; i < domLen; i++) {
 var v = spanDoms[i];
 // do something you want deal with DOM
}
// 第二种方式:Array 的 forEach函数
Array.prototype.forEach.call(spanDoms, function(v) {
 // do something you want deal with DOM
});
// 第三种方式:Array 的 forEach函数
[].forEach.call(spanDoms, function(el) {
 // do something you want deal with DOM
 el.classList.remove(&#39;active&#39;);
});
// 第四种方式:继承Array 的 forEach函数
NodeList.prototype.forEach = Array.prototype.forEach;
spanDoms.forEach(function(v) {
 // do something you want deal with DOM
});

Das Obige habe ich für alle zusammengestellt. Ich hoffe, es wird in Zukunft für alle hilfreich sein.

Verwandte Artikel:

So verwenden Sie Jade-Vorlagen in Vue

Übergabe von Vorlagen an Komponenten in Angular

Verwenden von Async- und Await-Funktionen in Node.js

Das obige ist der detaillierte Inhalt vonSo implementieren Sie eine Schleifen-Nodelist-Dom-Liste mit JS. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn