Die Anzeige an der Haltestelle
An der Haltestelle steht: „Linie 12 in 7 Minuten.“ Eine Minute später steht dort „in 6 Minuten“.
Niemand tauscht ein Schild aus. Ein Programm ändert den Text auf dem Bildschirm.
Das kann JavaScript auch auf einer Webseite. Heute lernst du, wie.
Am Ende dieser Lektion
Notiz
Ich kann mit JavaScript den Text und die Farbe eines Elements auf einer Webseite ändern.
Schlüsselwörter
| Begriff | Was er bedeutet | Beispiel |
|---|---|---|
| Element | ein Teil der Seite, zum Beispiel ein Absatz oder eine Überschrift | |
| id | ein Name, mit dem man ein Element eindeutig findet | id="titel" |
| getElementById | sucht ein Element anhand seiner id | document.getElementById("titel") |
| textContent | der Text in einem Element | titel.textContent |
| style | die Eigenschaften für Farbe, Größe und Aussehen | titel.style.color |
| classList | die Liste der CSS-Klassen eines Elements | titel.classList.add("rot") |
Die Zellen, die Lernende ausfüllen, bleiben in dieser Vorschau leer.
Starter: Arrays
Probier es aus
Starter: Arrays
3 FragenDeine Antworten werden hier bewertet und nicht gespeichert. Mit einem Konto bleiben deine Ergebnisse erhalten.
Erst finden, dann ändern
Eine Webseite besteht aus Elementen. JavaScript kann sie nicht ändern, bevor es sie gefunden hat.
Dafür gibst du dem Element im HTML eine id. Im Skript schreibst du dann document.getElementById("anzeige"). Du bekommst das Element zurück und speicherst es in einer Variablen.
Probiere es aus: Text ersetzen
<h1>Nächster Bus</h1>
<p id="anzeige">Linie 12 fährt in 7 Minuten.</p>
textContent ist der Text im Element
Mit element.textContent liest du den Text. Mit element.textContent = "Neu" ersetzt du ihn.
Den Text kannst du auch aus Variablen zusammensetzen: anzeige.textContent = "Noch " + minuten + " Minuten."
Kurze Prüfung: Elemente finden
Probier es aus
Kurze Prüfung: Elemente finden
3 FragenDeine Antworten werden hier bewertet und nicht gespeichert. Mit einem Konto bleiben deine Ergebnisse erhalten.