Heim >Web-Frontend >js-Tutorial >Wie rufe ich Elemente mit derselben ID in JavaScript ab?

Wie rufe ich Elemente mit derselben ID in JavaScript ab?

Linda Hamilton
Linda HamiltonOriginal
2024-11-17 16:19:02604Durchsuche

How to Retrieve Elements with the Same ID in JavaScript?

So rufen Sie Elemente mit derselben ID mit getElementById von JavaScript ab

Erhalten einer Sammlung von Elementen basierend auf ihrer gemeinsamen ID mit getElementById() von JavaScript Die Methode mag schwierig erscheinen, wenn man bedenkt, dass sie nicht in der Lage ist, mehrere Elemente mit identischen IDs zu verarbeiten. Aus historischen Gründen ist es jedoch immer noch relevant, diese Technik zu erforschen.

getElementById() und mehrere IDs

Typischerweise sollten HTML-Elemente keine doppelten IDs haben, wie es heißt verstößt gegen das Einzigartigkeitsgebot. In bestimmten Fällen, beispielsweise bei der Arbeit mit falsch erstellter HTML-Dokumentation, kann es jedoch erforderlich sein, Elemente mit derselben ID zu bearbeiten.

Um die inhärente Einschränkung von getElementById() zu umgehen, können Sie querySelectorAll() nutzen Methode statt. Mit dieser Methode können Sie eine Sammlung von Elementen basierend auf einem angegebenen CSS-Selektor abrufen. Durch Angabe des CSS-Selektors „[id='myId']“ können Sie alle Elemente mit der angegebenen ID auswählen.

Codebeispiel

Hier ist ein Codeausschnitt dazu demonstriert, wie man querySelectorAll() verwendet, um Elemente mit derselben ID abzurufen:

var elms = document.querySelectorAll("[id='myId']");

// Perform operations on the collection of elements
for (var i = 0; i < elms.length; i++) {
  elms[i].style.display = "none"; // Example operation
}

In diesem Beispiel die Variable elms enthält eine Array-ähnliche Sammlung aller Elemente mit der angegebenen ID. Anschließend können Sie alle erforderlichen Vorgänge für diese Elemente ausführen, z. B. sie mit der Eigenschaft style.display ausblenden.

Das obige ist der detaillierte Inhalt vonWie rufe ich Elemente mit derselben ID in JavaScript ab?. 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