Добавить элемент в раскрывающийся список в html с помощью javascript

У меня есть этот javascript + html для заполнения раскрывающегося меню, но он не работает, я делаю что-то неправильно? Примечание. Я хочу, чтобы выпадающее меню было заполнено на странице Загрузить

    <!DOCTYPE html>
    <html>
    <head>
    <script>
    function addList(){
    var select = document.getElementById("year");
    for(var i = 2011; i >= 1900; --i) {
    var option = document.createElement('option');
    option.text = option.value = i;
    select.add(option, 0);
      }
     }
    </script>
    </head>

    <body>

       <select id="year" name="year"></select>

    </body>
    </html>

Ответ 1

Поскольку ваш script находится в <head>, вам нужно обернуть его в window.onload:

window.onload = function () {
    var select = document.getElementById("year");
    for(var i = 2011; i >= 1900; --i) {
        var option = document.createElement('option');
        option.text = option.value = i;
        select.add(option, 0);
    }
};

Вы также можете сделать это таким образом

<body onload="addList()">

Ответ 2

Для повышения производительности я рекомендую следующее:

var select = document.getElementById("year");
var options = [];
var option = document.createElement('option');

//for (var i = 2011; i >= 1900; --i)
for (var i = 1900; i < 2012; ++i)
{
    //var data = '<option value="' + escapeHTML(i) +'">" + escapeHTML(i) + "</option>';
    option.text = option.value = i;
    options.push(option.outerHTML);
}

select.insertAdjacentHTML('beforeEnd', options.join('\n'));

Это позволяет избежать перерисовывания после каждого appendChild, что значительно ускоряет процесс, особенно для большего количества параметров.

Необязательно для генерации строки вручную:

function escapeHTML(str)
{
    var div = document.createElement('div');
    var text = document.createTextNode(str);
    div.appendChild(text);
    return div.innerHTML;
}

Однако, я бы не использовал такие методы вообще.

Это кажется грубым. Лучше всего это сделать с помощью documentFragment:

var docfrag = document.createDocumentFragment();

for (var i = 1900; i < 2012; ++i)
{
     docfrag.appendChild(new Option(i, i));
}

var select = document.getElementById("year");
select.appendChild(docfrag);

Ответ 3

Попробуйте это

<script type="text/javascript">
    function AddItem()
    {
        // Create an Option object       
        var opt = document.createElement("option");        

        // Assign text and value to Option object
        opt.text = "New Value";
        opt.value = "New Value";

        // Add an Option object to Drop Down List Box
        document.getElementById('<%=DropDownList.ClientID%>').options.add(opt);
    }
<script />

Значение добавится в раскрывающийся список.

Ответ 4

Я думаю, что вы только определили функцию. вы не запускаете его нигде.

сделайте

window.onload = addList();

или вызвать его на другом событии

после определения

см. это fiddle

Ответ 5

Попробуйте использовать метод appendChild:

select.appendChild(option);