Arbeiten mit Textfeldern in JavaScript
Jetzt lernen wir, Text von den Benutzern
unserer Website zu erhalten. Dafür
ist in HTML ein spezielles Tag input vorgesehen,
das ein Textfeld zur Dateneingabe darstellt.
<input>
Dieses Tag hat ein spezielles Attribut value,
das den Anfangstext festlegt, der
beim Aufruf der Seite im Input stehen wird:
<input value="text">
Der Benutzer unserer Website kann nach dem Aufruf der
Seite den Text des Inputs ändern.
Dabei, wenn wir eine Variable haben, die einen
Verweis auf dieses Input enthält, dann wird die Eigenschaft value
dieser Variable immer den aktuellen Wert des Input-Textes enthalten.
Probieren wir es praktisch aus. Nehmen wir an, wir haben ein Input
mit dem Attribut value:
<input id="elem" value="text">
Holen wir uns den Verweis auf dieses Input in eine Variable:
let elem = document.querySelector('#elem');
Und jetzt geben wir den aktuellen Text des Inputs auf dem Bildschirm aus:
console.log(elem.value);
Und jetzt ändern wir den Text des Inputs auf einen anderen:
elem.value = 'new text';
Gegeben sind ein Input und ein Button. Beim Klick auf den Button soll ein beliebiger Text in das Input geschrieben werden.
Gegeben sind ein Input, ein Absatz und ein Button. Beim Klick auf den Button soll der Text aus dem Input in den Absatz geschrieben werden.
Gegeben sind zwei Inputs und ein Button. In den ersten Input wird vom Benutzer eine Zahl eingegeben. Beim Klick auf den Button soll das Quadrat der eingegebenen Zahl in den zweiten Input geschrieben werden.
Gegeben sind zwei Inputs und ein Button. Beim Klick auf den Button soll in den ersten Input der Wert des zweiten Inputs geschrieben werden, und in den zweiten Input - der Wert des ersten. Ihr Code sollte universell funktionieren, für beliebige Werte der Inputs.
Gegeben sind 5 Inputs, ein Absatz und ein Button. In
die Inputs werden Zahlen eingegeben. Beim Klick auf den Button
soll der Durchschnitt der eingegebenen Zahlen in den Absatz geschrieben werden.