如何使用javascript在HTML5中填充下拉列表？

我想从web服务获取数据，并将其填充到下拉列表中。 我的代码如下所示。已创建下拉列表，但无法填充数据。请给我一些代码

function jsondata(data)
    {
        alert("JSONdata");
        var parsedata=JSON.parse(JSON.stringify(data));
        var captain_details=parsedata["Captain Details"];

        var drop_down=document.getElementById("captainlist");
        var drop=document.createElement("select");

        for(var i=0;i<captain_details.length;i++)
        {
             var captain = captain_details[i];
             captain_name=captain['Captain Name'];

             alert(captain_name);   

             document.getElementById("captainlist").appendChild(drop);
             drop.add(captain_name,null);
        }
    }

函数jsondata（数据）
{
警报（“JSONdata”）；
var parsedata=JSON.parse（JSON.stringify（data））；
var captain_details=parsedata[“captain details”]；
var drop_down=document.getElementById（“船长列表”）；
var drop=document.createElement（“选择”）；
对于（var i=0；i
drop
在本例中不是节点-->
document.getElementById（“captainlist”）.appendChild（drop）；
您应该创建节点，设置其值和文本并将其添加到元素中。我假设
var drop\u down=document.getElementById（“captainlist”）中的drop
根据
drop指向节点。add
需要一个HTMLElement，而不是一个文本字符串


var数据=[
{name:“Mal Reynolds”}，
{name:“Piet Heyn”}，
{姓名：“Jean-Luc Picard”}
];
var elm=document.getElementById（“captains”）；//elm是一个元素
对于（变量i=0，len=data.length；i

var data = [
    { name: "Mal Reynolds" },
    { name: "Piet Heyn" },
    { name: "Jean-Luc Picard" }
];

var elm = document.getElementById("captains"); // elm is a <select> element

for (var i = 0, len = data.length; i < len; i++) {
    var name = data[i].name;

    // create an option element
    var option = document.createElement("option");
    option.value = i;
    option.textContent = name;

    // add option
    elm.add(option);
}