DOM-Elemente in JavaScript abrufen
Jetzt lernen wir, wie man DOM-Elemente einer Seite abruft, um später Manipulationen an ihnen vorzunehmen.
Nehmen wir an, wir haben einen Button:
<input id="button" type="submit">
Lassen wir uns einen Verweis auf diesen Button in einer Variable speichern.
Dazu sollte die Methode querySelector
des speziellen Objekts document verwendet werden. Diese
Methode nimmt einen CSS-Selektor als Parameter entgegen und
gibt einen Verweis auf das gefundene Element zurück.
Unser Button hat das Attribut id mit
dem Wert button. Daher können wir
diesen Button mit dem Selektor #button finden.
So, lassen wir uns unseren Button suchen und den
Verweis darauf in einer Variable speichern:
let button = document.querySelector('#button');
console.log(button);
Es gibt 3 Absätze:
<p id="elem1">1</p>
<p id="elem2">2</p>
<p id="elem3">3</p>
Speichern Sie den Verweis auf jeden Absatz in eine separate Variable und geben Sie den Inhalt jeder dieser Variablen in der Konsole aus.