Ввод значения «выберите» тег в переменную JavaScript

Question

образец <select> HTML элемент формы из W3Schools (немного изменен):

<select> 
    <option value="a">Option A</option> 
    <option value="b">Option B</option> 
    /*...*/ 
</select> 

Насколько я мог видеть, ни option ни select не имеет id свойство, так старый добрый document.getElementById("name of select element").value не работает.

Но тогда, как я могу поместить атрибут value опции в список в переменную JS?

Я знаю, что это может быть сделано вызовом функции, например. когда я нажимаю элемент кнопки, но что мне нужно записать в эту функцию?

Answer 1

Помимо просто придав ему идентификатор, вы можете добавить событие OnChange:

<select onchange="yourfunction(this.value)"> 
... 

Есть и другие способы доступа к элементам в вашем DOM. Например, если предположить, что это единственное (или первый) выбрать на странице вы можете получить доступ к его значению с линией, как это:

var val = document.getElementsByTagName("select")[0].value; 

Answer 2

Если вы не имеете id работать с того, DOM предоставляет несколько другого API, которые вы можете использовать, но, вероятно, наиболее универсальным является:

document.querySelector("CSS Selector Here"); 

Таким образом, вы можете использовать селектор, который находит select элемента по имени тега select или его положение в DOM или класс имя, примененное к нему и т. д.

Затем, чтобы получить значение, напишите так:

var val = document.querySelector("CSS Selector Here").selectedIndex.value;