Udalosť change v JavaScripte

V tejto lekcii si spolu rozoberieme udalosť change, ktorá vzniká vo vstupných poliach pri ich zmene. Čo to znamená? Povedzme napríklad, že máte input a v ňom je nejaký text. Ak tento text zmeníte, práve vtedy táto udalosť nastane.

Pozrime sa na príklad. Majme input:

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

Po jeho zmene vypíšme do konzoly jeho novú hodnotu:

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

elem.addEventListener('change', function() {
  console.log(this.value);
});

Задание 1

Daný je input a odsek. Po zmene inputu vypíšte jeho text do odseku.

Задание 2

Daný je checkbox. Po zmene checkboxu zobrazte na obrazovke jeho nový stav.

Задание 3

Vysvetlite, v čom je rozdiel medzi udalosťami blur a change.

Задание 4

Daný je input. Po jeho zmene skontrolujte, či je počet znakov v ňom menší ako 5 alebo nie. Ak je menší - zafarbite rám inputu na zelenú farbu, a ak je väčší - na červenú.