Use option:checked
to find the currently selected option:
select.querySelector('option:checked')
Yes, :checked
, not :selected
.
This is the same as finding an option with the { selected: true }
property in JavaScript:
select.querySelectorAll('option').find((option) => option.selected)
What about the selected
attribute?
Note that option[selected]
would only find an <option selected>
tag. This may be the selected option right after loading the page, but not once the user switched to a different value. It also won't work in JavaScript-heavy applications where you might not be rendering an option
tag with the selected
attribute in the first place.
Posted by Arne Hartherz to makandra dev (2021-12-09 10:51)