Práce s textovými poli v JavaScriptu

Nyní se naučíme získávat text od uživatelů našich stránek. K tomu v HTML existuje speciální tag input, který představuje textové pole pro zadávání dat.

html<input>

Tento tag má speciální atribut value, který nastavuje počáteční text, který bude v inputu při načtení stránky:

html<input value="text">

Uživatel našich stránek může po načtení stránky změnit text inputu. Přitom, pokud máme proměnnou obsahující odkaz na tento input, pak vlastnost value této proměnné bude vždy obsahovat aktuální hodnotu textu inputu.

Zkusme to v praxi. Mějme input s atributem value:

html<input id="elem" value="text">

Získáme odkaz na tento input do proměnné:

javascriptlet elem = document.querySelector('#elem');

A nyní vypišme na obrazovku aktuální text inputu:

javascriptconsole.log(elem.value);

A nyní změňme text inputu na jiný:

javascriptelem.value = 'new text';