Tekstiväljadega töötamine JavaScriptis

Praegu õpime saama teksti meie saidi kasutajatelt. Selleks on HTML-is ette nähtud spetsiaalne silt input, mis esindab endast andmete sisestamiseks mõeldud tekstivälja.

html<input>

Sellel silbil on spetsiaalne atribuut value, mis määrab algse teksti, mis on kirjutatud inputi lehele sisenemisel:

html<input value="text">

Meie saidi kasutaja saab peale lehele sisenemist muuta inputi teksti. Sel juhul, kui meil on muutuja, mis sisaldab viidet sellele inputile, siis omadus value selles muutujas sisaldab alati inputi teksti praegust väärtust.

Proovime seda praktiliselt. Olgu meil input atribuudiga value:

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

Saame viida sellele inputile muutujasse:

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

Ja nüüd kuvame ekraanile inputi praeguse teksti:

javascriptconsole.log(elem.value);

Ja nüüd muudame inputi teksti teiseks:

javascriptelem.value = 'new text';