Kufanya Kazi na Orodha ya Kujipinda katika JavaScript

Katika somo hili tutasoma kazi na kitambulishi select, kinachowakilisha orodha ya kujipinda. Ikiwa hujui jinsi ya kufanya kazi na kitambulishi hiki kwa kutumia HTML, kwanza soma muundo wake kwenye mwongozo kupitia kiungo hiki: select.

Wacha tuone jinsi ya kufanya kazi na kitambulishi hiki kupitia JavaScript. Hebu tuwe na orodha ya kujipinda kama hii:

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

Tutapata kiungo kwa kichaguzi kwenye kutofautisha:

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

Sasa hebu tukibadilika kichaguzi tuonyeshe kwenye skrini maandishi ya kipengee kilichochaguliwa. Ili kufanya hivyo, inahitajika kusoma sifa ya value ya kichaguzi chetu:

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

Kichaguzi kimetolewa, aya na kifungo. Kwa kubonyeza kifungo onyesha maandishi ya kipengee kilichochaguliwa kwenye orodha kwenye aya.

Tengeneza orodha ya kujipinda ya miaka kuanzia 2020 hadi 2030. Unapochagua kipengee fulani kwenye orodha, onyesha ujumbe ikiwa huu ni mwaka wa leap au la.