# Работа с выпадающем списком select на JavaScript

В данном видео мы изучим работу с выпадающем списком select с помощью JavaScript. Мы научимся получать значение и текст выбранного пункта списка разными способами, добавлять новые пункты списка, а также работать с мультиселектами.

## Исходники кода

`<select> <option value="one">Option one</option> <option value="two" selected>Option two</option> <option value="three">Option three</option> </select> <button>click me</button>` `var select = document.querySelector('select'); var button = document.querySelector('button'); //select.add(new Option('text', 'value', true, true)); /*select.addEventListener('change', function() { console.log(this.value); });*/ button.addEventListener('click', function() { //console.log(select.value); //console.log(select.selectedIndex); //select.value = 'one'; //select.selectedIndex = 2; //console.log(select.item(0)); //console.log(select[0]); //console.log(select.querySelectorAll('option')); //console.log(select.options); /*for (var i = 0; i < select.options.length; i++) { console.log(select.options[i].text); console.log(select.options[i].value); console.log(select.options[i].selected); }*/ //select[0].selected = true; //console.log(select[select.selectedIndex].text); //console.log(select.querySelector('option[selected]')); //console.log(select.selectedOptions); //console.log(select.selectedOptions[0].text); //select.add(new Option('text', 'value', true, true)); select.length = 0; });`
←→
↑