Обращение к активному элементу select в js

Вопрос довольно простой, как в яваскрипт корректно обратиться к содержимому активного "option" элемента "select" хтмл? Подозреваю, что должно быть что-то вроде этого:

document.select(1).value(1).focus == true;

Но такое условие не работает.


Ответы (1 шт):

Автор решения: drako black

Путем метода проб и ошибок, нашел 2 возможных варианта:

  1. Вариант humster_spb:
document.querySelector('[name="1"]').value

Здесь важный момент, что обращение идет не к содержимому "option", а к его значению "value", которое по умолчанию имеет тип "string", так что если данные нужны для каких-либо математических вычислений, то к данному выражению нужно еще применить функцию "Number()". В противном случае, все математические операции над содержимым "value" будут выполняться так, словно это "string", а не число.

Number(document.querySelector('[name="1"]').value);
  1. Через id элемента: сначала нужно присвоить уникальный id каждой опции, а затем данные элемента выбора можно вызвать следующим выражением:
document.getElementById('s22').content;

Работает, как с "content" так и с "value".

Стоит отметить, что данные выражения сами по себе уже являются переменными, то есть с ними можно выполнять операции. Например, если у нас есть переменная A и нам нужно прибавить к ней значение, которое содержится в select.option(1) (первой опции элемента select) То следующее выражение будет вполне работать:

<select name="1">
<option id="b1" value="b">1</option>
<option id="b2" value="d">2</option>
</select>
let A = 0;
A = A + document.getElementById('b1').content;
Consol.log('Result', A); // A=1;

При этом, если использовать вместо "content" "value", но не использовать Number(), то получиться следующее:

let A = 0;
A = A + document.getElementById('b1').value;
Consol.log('Result', A); // A=0b1;

А с Number():

let A = 0;
A = A + Number(document.getElementById('b1').value);
Consol.log('Result', A); // A=Null, так как "b" не является числом и не является какой-либо заданной переменной. 

Вот если "b" сделать числовой переменной, то это вполне может сработать:

let b = 11;
let A = 0;
A = A + Number(document.getElementById('b1').value);
Consol.log('Result', A); // A=11.
→ Ссылка