Here I have a simple example of the Option constructor where I am using all the available options. This results in an option element that has an inner text value of mode2, but a value of 2, more on that when we get into events. In addition there are two boolean values that can be passed to set the option as the default option and to make it selected when the page loads in that order.
In this example I am also using the add method of the select elements as a way to add an additional option to a hard coded select element. However I am still not doing much of anything with the select element, and the options for it. In order to have a functioning select tag drop down menu I am going to want to have at least one event listener for it that will preform any necessary actions that must happen each time the options is changed.
There are many options for event handlers when it comes to working with a select element, but the typical event to use will be the on change event. This is an event that you will want to attach to the select element, and not each option. The reason why is that it is really the select option that stores the value of interest and all the options are just simple that, optional values for the select element.
That is it for now when it comes to the Option constructor, as well as option elements, and the select parent element that that option elements are nested in. There is a bit to write about when it comes to everything that surrounds an option element, so in time I might get back around to this post and expand it with some more examples when and if I get to it.