Document.getElementById()

 
Gibt eine Referenz zu einem Element anhand seiner ID zur√ľck.
 

Syntax

element = document.getElementById(id);

Parameter

  • element ist eine Referenz zu einem Element-Objekt oder null wenn sich kein Element mit der angegebenen ID im Dokument befindet.
  • id ist ein String, der auf Gro√ü- und Kleinschreibung achtet und die einmalige ID des gesuchten Elements darstellt.

Beispiel

<!DOCTYPE html>
<html>
<head>
  <title>getElementById Beispiel</title>
  <script>
  function changeColor(newColor) {
    var elem = document.getElementById("para1");
    elem.style.color = newColor;
  }
  </script>
</head>
<body>
  <p id="para1">Irgendein Text</p>
  <button onclick="changeColor('blue');">Blau</button>
  <button onclick="changeColor('red');">Rot</button>
</body>
</html>

Anmerkungen

Neue Benutzer sollten beachten, dass die Gro√ü- und Kleinschreibung bei "Id" im Namen der Methode korrekt sein muss, damit der Code funktioniert - 'getElementByID' funktioniert nicht, auch wenn es richtig zu sein scheint.

Wenn kein Element mit der angegebenen id existiert, gibt die Funktion null zur√ľck. Beachte, dass der ID-Parameter auf Gro√ü- und Kleinschreibung achtet. Daraus folgt, dass document.getElementById("Main") anstatt des Elements <div id="main"> null zur√ľckgibt, weil "M" und "m" f√ľr den Zweck der Methode unterschiedlich sind.

Elemente die sich nicht im Dokument befinden werden nicht von getElementById gesucht. Wenn man ein Element erstellt und ihm eine ID zuweist, so muss man das Element mit insertBefore oder einer √§hnlichen Methode in den Dokumentenbaum einf√ľgen, bevor man darauf mit getElementById zugreifen kann.

var element = document.createElement("div");
element.id = 'testqq';
var el = document.getElementById('testqq'); // el wird null!

Nicht-HTML-Dokumente. Die DOM-Implementierung muss eine Information enthalten, welche angibt, welches Attribut vom Typ ID ist. Attribute mit dem Namen "id" sind solange nicht vom Typ ID bis sie in der Dokumenttypdefinition als solche definiert werden. Das id-Attribut ist in gebr√§uchlichen F√§llen wie bei XHTML, XUL und anderen als ID-Typ definiert. Implementierungen, die nicht wissen, ob ein Attribut vom Typ ID ist oder nicht geben erwartungsgem√§√ü null zur√ľck.

Browserkompatibilität

Wir konvertieren die Kompatibilitätsdaten in ein maschinenlesbares JSON Format. Diese Kompatibilitätstabelle liegt noch im alten Format vor, denn die darin enthaltenen Daten wurden noch nicht konvertiert. Finde heraus wie du helfen kannst!

Feature Chrome Firefox (Gecko) Internet Explorer Opera Safari (WebKit)
Basic support 1.0 1.0 (1.7 oder fr√ľher) 5.5 7.0 1.0
Feature Android Firefox Mobile (Gecko) IE Phone Opera Mobile Safari Mobile
Basic support 1.0 1.0 (1.0) 6.0 6.0 1.0

Spezifikation

getElementById wurde in DOM Level 1 f√ľr HTML Dokumente eingef√ľhrt und in DOM Level 2 zu allen Dokumenten verschoben. 

Siehe auch

  • document Referenz f√ľr andere Methoden und Eigenschaften, die man benutzen kann um Referenzen zu Elementen im Dokument zu bekommen.
  • document.querySelector() f√ľr Selektoren mit Abfragen wie 'div.myclass'
  • xml:id - hat eine Hilfsmethode, die es getElementById erlaubt, "xml:id" in XML-Dokumenten zu erhalten (wie es z.B. von Ajax-Aufrufen zur√ľckgegeben wird)