Unterschied zwischen getElementById und getElementsByClassName

Question

ich eine JavaScript-Anweisung geschrieben haben:

var n=document.getElementById("image"); 

dieser Code funktioniert nicht. Aber wenn ich ID zu Klasse und die Anweisung ändern:

es funktioniert einwandfrei. Kann mir jemand erklären, warum kann ich nicht mit id das gleiche tun ..

Vielen Dank im Voraus

HINWEIS: Wenn ich mit der Arbeit sagen ich meine Variable ‚n‘ gespeichert gewissen Wert.

PS: Um all diesen Jungs, die auf den Daumen nach unten wollen diese question..I bitten Sie, den Grund zu erklären, bevor dies zu tun ... Chill

Answer 1

Vergewissern Sie sich, wenn getElementById Verwendung gibt es nur 1 Instanz der ID auf der Seite, da es nur die erste Übereinstimmung erhält. Während getElementByClassName alle Elemente mit dieser Klasse erhält.

ID - müssen in einer Seite

Klasse eindeutig sein - kann so oft wie möglich verwendet werden

Demo

Answer 2

in Html gibt es zwei Möglichkeiten, um eine bestimmte Instanz eines HTML-Tags zu identifizieren im Vergleich zu einer Gruppe von HTML-Elementen. Nehmen wir als Beispiel ein div.

Wenn wir irgendwo auf der Benutzeroberfläche eine Navigationsleiste hätten und es wäre die einzige Navigationsleiste, die wir haben würden, dann würden wir einen html id verwenden, um es so zu machen.

Wenn wir eine Gruppe von Inhalten angegeben hätten, würden wir alle divs markieren, die Inhalt mit einer anzeigen.

Also sagen wir zum Beispiel, wir haben diese einzelne Navbar und 3 Inhaltsfelder. Die html würde wie folgt aussehen:

<div id="navbar">stuff</div> 
<div class="content"> content stuff</div> 
<div class="content"> content stuff</div> 
<div class="content"> content stuff</div> 

Auf der Seite JS wenn wir document.getElementById() verwendet hat, können wir nur navbar Ziel, weil es nur 1 html id-Tag. Wenn wir jedoch die Gruppen von Inhaltsdivs erhalten möchten, die die Verwendung von document.getElementByClassName() bedeuten würden, und weil mehrere Klassen existieren, würden wir ein Array dieser HTML-divs der Klasse content zurückbekommen.

So hängt es wirklich von Ihrem HTML ab.