Wie durchläuft man ausgewählte Elemente mithilfe von document.querySelectorAll ordnungsgemäß?

Durchlaufen ausgewählter Elemente mit document.querySelectorAll

In der Webentwicklung ist häufig ein Durchlaufen ausgewählter Elemente erforderlich. document.querySelectorAll stellt ein Array-ähnliches Objekt bereit, das die ausgewählten Elemente darstellt. Allerdings können Probleme auftreten, wenn die Iteration direkt auf der NodeList durchgeführt wird, was dazu führt, dass zusätzliche Elemente in der Ausgabe erscheinen.

Um ausgewählte Elemente ordnungsgemäß zu durchlaufen, konvertieren Sie die NodeList mithilfe der Spread-Syntax in ein Array. Indem Sie stattdessen das resultierende Array durchlaufen, können Sie die zusätzlichen Elemente vermeiden. Diese Methode ist ideal für moderne JavaScript-Umgebungen mit Unterstützung für ES2015 und Babel.js.

Zum Beispiel, wenn Sie Kontrollkästchen mit document.querySelectorAll('.check') durchlaufen möchten:

<code class="javascript">var checkboxes = document.querySelectorAll('.check');
var checkboxesArray = [...checkboxes];

checkboxesArray.forEach(checkbox => {
  console.log(checkbox);
});</code>

Dieses Code-Snippet durchläuft korrekt nur die Kontrollkästchenelemente ohne zusätzliche Elemente.

Das obige ist der detaillierte Inhalt vonWie durchläuft man ausgewählte Elemente mithilfe von document.querySelectorAll ordnungsgemäß?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!