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

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!