JavaScript-те выпадающі тізімдермен жұмыс

Бұл сабақта біз select тегімен жұмыс істеуді үйренеміз, ол выпадающі тізімді білдіреді. Егер сіз бұл тегпен HTML-де жұмыс істей білмесеңіз, алдымен оның құрылымын осы сілтеме бойынша анықтамалықтан оқып шығыңыз: select.

Енді осы тегпен JavaScript арқылы қалай жұмыс істеуге болатынын қарастырайық. Бізде мынадай выпадающі тізім бар делік:

<select id="select">
	<option>one</option>
	<option selected>two</option>
	<option>three</option>
</select>

Селектке сілтемені айнымалыға алайық:

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

Енді селект өзгерген кезде тізімнің таңдалған пунктінің мәнін экранға шығарайық. Ол үшін біз селектіміздің value қасиетін оқуымыз керек:

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

Селект, абзац және батырма берілген. Батырманы басқан кезде тізімнің таңдалған пунктінің мәнін абзацқа шығарыңыз.

2020 жылдан 2030 жылға дейінгі выпадающі жылдар тізімін жасаңыз. Тізімнің кез келген пунктін таңдаған кезде, бұл жылдың високосный жыл екенін хабарлаңыз.