Использование jQuery для получения текста из определенного тега option

Часто при работе с выпадающими списками на языке JavaScript с использованием библиотеки jQuery возникает задача получения текста из определенного тега option, основываясь на атрибуте value.

Рассмотрим на примере:

<select id='list'>
    <option value='1'>Первый вариант</option>
    <option value='2'>Второй вариант</option>
    <option value='3'>Третий вариант</option>
</select>

Если появилась необходимость получить текст «Второй вариант», зная, что его значение value равно ‘2’, некоторые могут предположить, что это можно сделать с помощью следующего селектора:

$("#list[value='2']").text();

Однако, такой подход не сработает, поскольку селектор [value='2'] применяется к тегу select, а не к тегу option.

Для решения этой задачи правильно будет использовать следующий селектор:

$("#list option[value='2']").text();

В данном случае селектор option[value='2'] применяется уже к тегу option, что позволяет корректно найти нужный тег и получить его текстовое содержимое с помощью метода .text().

Таким образом, важно помнить о правильной структуре селекторов при работе с элементами HTML-документа на языке JavaScript с использованием библиотеки jQuery.