JavaScript-da ochiladigan ro'yxatlar bilan ishlash

Ushbu darsda biz select tegi bilan ishlashni o'rganamiz, bu ochiladigan ro'yxatni ifodalaydi. Agar siz ushbu tegn bilan HTML-da ishlay olmasangiz, avval uning tuzilishini quyidagi havoladagi qo'llanmada o'rganing: select.

Keling, ushbu tegn bilan JavaScript orqali qanday ishlashni ko'rib chiqaylik. Faraz qilaylik, bizda quyidagi ochiladigan ro'yxat mavjud:

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

Keling, select ga o'zgaruvchiga havola olamiz:

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

Keling, endi select o'zgarganda ro'yxatning tanlangan bandining matnini ekranda chiqaramiz. Buning uchun biz select ning value xususiyatini o'qishimiz kerak:

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