Skip to content
Related Articles

Related Articles

HTML | DOM Select selectedIndex Property

Improve Article
Save Article
  • Difficulty Level : Basic
  • Last Updated : 16 Aug, 2022
Improve Article
Save Article

The Select selectedIndex property in HTML DOM is used to set or return the index of the selected option in a drop-down list. The index of the drop-down list generally starts with 0 and returns -1 if no option is selected. This property returns the index of the first option if the drop-down list allows multiple selections. 

Syntax:

  • It returns the Select selectedIndex property.
selectObject.selectedIndex
  • It is used to set the Select selectedIndex property.
 selectObject.selectedIndex = number 

Property Values: It contains single value number which is used to specify the index of the selected option in a drop-down list. 

Below program illustrates the Select selectedIndex property in HTML DOM: 
Example: This example uses Select selectedIndex property to select the <option> element with index “3”. 

HTML




<!DOCTYPE html>
<html>
<head>
    <title>
        HTML DOM Select selectedIndex Property
    </title>
</head>
 
<body style="text-align:center;">
    <h1 style="color:green;">
        GeeksforGeeks
    </h1>
    <h2 style="font-family: Impact;">
        Select selectedIndex Property
    </h2><br>
    Select your preferred course from the drop-down list:<br>
    <select name="Courses Titles" id="myCourses">
        <option value="C++">c++</option>
        <option value="Placement">Placement</option>
        <option value="Java">Java</option>
        <option value="Python">Python</option>
    </select>
    <p>
        To select the option element with index "3",
        double-click the "Return Element" button.
    </p>
    <button ondblclick="myGeeks()">
        Return Element
    </button>
     
    <!-- This example sets Select selectedIndex Property -->
    <script>
        function myGeeks() {
            document.getElementById("myCourses").selectedIndex
                    = "3";
        }
    </script>
</body>
</html>

Output: 

Before Clicking the button: 

After Clicking the button: 

Supported Browsers: The browser supported by DOM Select selectedIndex property are listed below:

  • Apple Safari
  • Internet Explorer
  • Firefox
  • Google Chrome
  • Opera

My Personal Notes arrow_drop_up
Related Articles

Start Your Coding Journey Now!