HTML | DOM Select add Method
The Select add() method is used for adding an option in a drop-down list. The Select add() method accepts the index number as a parameter for adding the new option in the desired position.
Syntax:
selectObject.add(option, index)
Property Values:
- option: It is a mandatory parameter which is used to specify option or optgroup element.
- index: It is an optional parameter which is used to specify the index position for the new option element.
Below program illustrates the Select add method :
1. Adding an “Interview Preparation” course at index position “1” of the drop-down list.
Input:
<!DOCTYPE html><html><head> <title>Select add Method in HTML</title> <style> h1 { color:green; } h2 { font-family: Impact; } body { text-align:center; } </style> </head><body> <h1>GeeksforGeeks</h1> <h2>Select add Method</h2><br> Select your preferred course from the drop-down list:<br> <select id="myCourses" size="8"> <option value="C++">c++</option> <option value="Placement">Placement</option> <option value="Java">Java</option> <option value="Python">Python</option></select> <p>To add a course titled "Interview Preparation" in the dropdown list, double-click the "Add" button.</p> <button ondblclick="My_list()">Add</button> <script> function My_list() { var d = document.getElementById("myCourses"); var option = document.createElement("option"); option.text = "Interview"; d.add(option, d[1])} </script> </body></html> |
Output:
Before clicking the button:
After clicking the button:
Supported Browsers:
- Apple Safari
- Internet Explorer
- Firefox
- Google Chrome
- Opera
Please Login to comment...