Sometimes, we want to set the selected option of the select box with JavaScript.
In this article, we’ll look at how to set the selected option of the select box with JavaScript.
How to set the selected option of the select box with JavaScript?
To set the selected option of the select box with JavaScript, we can use the setAttribute method.
For instance, we write
<select id="gate">
<option value="null">- choose -</option>
<option value="Gateway 1">Gateway 1</option>
<option value="Gateway 2">Gateway 2</option>
</select>
to add the select element.
Then we write
document
.querySelector("#gate option[value='Gateway 2']")
.setAttribute("selected", true);
to select the option element we want to select with querySelector.
And we call setAttribute with 'selected' and true to select the option.
Conclusion
To set the selected option of the select box with JavaScript, we can use the setAttribute method.
