In this section, we will learn what the selected attribute is and how to use it.
What is selected Attribute in HTML <option> Tag?
Consider an HTML <select> element which we can use to create a dropdown selection list; typically, we need users to pick an item from the list and submit it to a server. But sometimes we have a default option in mind and want that item to be submitted in case users didn’t pick an option from the list.
This is where we can use the `selected` attribute!
Simply put, this attribute in any <option> element and that becomes the pre-selected option for the list. This means the target option is the default value to be submitted to a server if users don’t change the option and pick another one.
HTML selected Attribute in <option> Tag Syntax:
<option selected> </option>
<option> Tag selected Attribute Values
The selected attribute is a boolean one and that means we only need to put this attribute in the opening tag of the <option> element. After that, the option becomes pre-selected.
Example: using selected attribute in HTML <option> tag
See the Pen using selected attribute in HTML <option> tag by Omid Dehghan (@odehghan) on CodePen.
Here the pre-selected option is red and so if users don’t pick another option, it’s the Red option that will be sent to a server then.