Получение пунктов выпадающего списка на JavaScript

Пусть у нас дан некоторый выпадающий список:

<select id="select"> <option value="one">один</option> <option value="two">два</option> <option value="three">три</option> </select>

Вопрос: как нам получить все пункты этого списка?

Самый простой способ - это воспользоваться соответствующим селектором:

console.log(document.querySelectorAll('#select option'));

Еще способ

Пусть у нас есть переменная, хранящая ссылку на селект:

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

В таком случае поиск тегов option можно вести не по всему документу, а конкретно в нашем селекте:

console.log(select.querySelectorAll('option'));

Продвинутый способ

При работе с селектами есть следующая особенность: переменная, в которой хранится ссылка на селект является массивом, элементами которого являются теги option.

Это значит, что эту переменную можно перебрать циклом:

let select = document.querySelector('#select'); for (let option of select) { console.log(option); }

Ну или просто обратится к пункту с нужным номером:

let select = document.querySelector('#select'); console.log(select[0]);

Переберите все пункты списка циклом и в конец текста каждого пункта добавьте значение его атрибута value.