Събитие change в JavaScript

В този урок вие и аз ще разгледаме събитието change, което възниква в полетата за въвеждане при тяхна промяна. Какво означава това? Да предположим, например, че имате input поле и в него има някакъв текст. Ако промените този текст, тогава в този случай ще възникне това събитие.

Нека разгледаме пример. Да предположим, че имаме input поле:

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

Нека при промяна на стойността му изведем в конзолата новата му стойност:

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

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

Дадено е input поле и абзац. При промяна на input полето изведете неговия текст в абзаца.

Даден е checkbox. При промяна на checkbox изведете на екрана новото му състояние.

Разкажете каква е разликата между събитията blur и change.

Дадено е input поле. При неговата промяна проверете дали броят на символите в него е по-малък от 5 или не. Ако е по-малък - оцветете границата на input полето в зелен цвят, а ако е по-голям - в червен.