Dropdown values in JavaScript refer to the options that are available to select from a dropdown list or a select element in HTML. JavaScript can be used to manipulate the values of a dropdown list in various ways, including adding or removing options, pre-selecting options, or hiding/disabling certain options. Dropdown values are a fundamental aspect of web development that allows developers to create dynamic and user-friendly interfaces for their web applications.
In HTML, a dropdown list is created using the <select>
element with three <option>
elements nested inside it. Each <option>
element represents one option that the user can select from the dropdown list. The value of each option is defined using the value attribute of the <option>
element.
In this code, we have a dropdown list with the id
vehicles
and the name of vehicles
. The for
attribute of the label element is used to associate the label with the dropdown list. Each option in the dropdown list is represented by an <option>
element with a value attribute and a visible text label.
In this code, we first get the dropdown list element using its id
(vehicles
) and store it in a variable called dropdown
. We then use the querySelector
method to get the specific option that we want to hide. In this case, we’re using the attribute selector [value='bike']
to select the option with the value of 'bike'
.
Finally, we set the display style property of the optionToHide
element to "none"
, which will hide it from the dropdown list.
Note: If you want to show the hidden option again, you can simply set its display style property back to
block
,inline
, or any other valid display value depending on the context.
Free Resources