Událost change v JavaScriptu

V této lekci si s vámi rozebereme událost change, která vzniká ve vstupních polích při jejich změnách. Co to znamená? Předpokládejme, že máte vstupní pole a v něm je nějaký text. Pokud tento text změníte, tehdy nastane tato událost.

Podívejme se na příklad. Předpokládejme, že máme vstupní pole:

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

Při jeho změně vypišme do konzole jeho novou hodnotu:

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

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

Задание 1

Je dáno vstupní pole a odstavec. Při změně vstupního pole vypište jeho text do odstavce.

Задание 2

Je dán zaškrtávací políčko. Při změně zaškrtávacího políčka vypište jeho nový stav na obrazovku.

Задание 3

Vysvětlete, jaký je rozdíl mezi událostmi blur a change.

Задание 4

Je dáno vstupní pole. Při jeho změně zkontrolujte, zda je počet znaků v něm menší než 5 nebo ne. Pokud je menší - obarvěte okraj vstupního pole na zelenou barvu, a pokud je větší - na červenou.