So fügen Sie wählen in Javascript

Question

Ich versuche, Option in Select-Tag hinzuzufügen, aber es funktioniert nicht.

container.appendChild(document.createTextNode("location")); 
var select = document.createElement("select"); 
var option1 = document.createElement("option"); 
option1.text = "mumbai"; 
option1.value = "mumbai"; 
container.appendChild(option1); 
container.appendChild(select); 

Answer 1

Sie option1 Element hinzufügen haben Element auszuwählen statt Containerelement.

Zeile ändern:

container.appendChild(option1); 

An:

select.appendChild(option1); 

Answer 2

Sie fügen die Option zum Container und nicht zum Auswählen hinzu. So ändern container.appendChild(option1);-select.appendChild(option1);:

var container = document.getElementById('elem') 
 
container.appendChild(document.createTextNode("location")); 
 
var select = document.createElement("select"); 
 
container.appendChild(select); 
 
var counter = 0; 
 
document.getElementById("btn").addEventListener("click", function() { 
 
    counter++; 
 
    var option1 = document.createElement("option"); 
 
    option1.text = "mumbai" + counter; 
 
    option1.value = "mumbai" + counter; 
 
    select.appendChild(option1); 
 
});

<div id='elem'> 
 

 
</div> 
 
<button name='btn' id='btn'>Add</button>

Answer 3

ein alternativer Weg ist, um options Liste wählen hinzuzufügen.

var select = document.getElementById('select'); 
 
var options = select.options; 
 
options[options.length] = new Option("Option 1", "1"); 
 
options[options.length] = new Option("Option 2", "2");

<select id="select"></select>

---

HTMLSelectElement.add() ist eine weitere Möglichkeit.

var sel = document.createElement("select"); 
 
var opt1 = document.createElement("option"); 
 
var opt2 = document.createElement("option"); 
 

 
opt1.value = "1"; 
 
opt1.text = "Option: Value 1"; 
 

 
opt2.value = "2"; 
 
opt2.text = "Option: Value 2"; 
 

 
sel.add(opt1, null); 
 
sel.add(opt2, null); 
 

 
document.body.appendChild(sel);