使用Javascript将新列表元素添加到无序列表

时间:2012-09-19 07:42:58

标签: javascript html

我正在尝试使用以下代码将新元素添加到无序列表中:

HTML:

<!DOCTYPE html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Javascript</title>
<link rel="stylesheet" href="jsPlay.css" type="text/css" />
<script src="jsPlay.js"></script>
</head>

<body>

<ul id="numberList"></ul>

</body>
</html>

Javascript:

window.onload = function()
{
    //alert("Window is loaded");

    var numberList = document.getElementById("numberList");


    //for every number between 100 and 200      
    for(var i = 0; i > 100 && i < 200; i++)
    {
        if ( i % 17 == 0 && i % 2 == 0) //if number evenly divisible by 17 and 2
        {
                    //create new li element
            var newNumberListItem = document.createElement("li");

                    //create new text node
            var numberListValue = document.createTextNode(i);

                    //add text node to li element
            newNumberListItem.appendChild(numberListValue);

                    //add new list element built in previous steps to unordered list
                    //called numberList
            numberList.appendChild(newNumberListItem);

        }
    }
}

当我在浏览器中运行它时,我只得到空白区域。我检查FireBug(在Firefox 15.0.1上)以查看是否有任何错误,但没有什么值得注意的。我认为我没有正确地绑定一些东西 - 这似乎是一个基本的问题,但我似乎无法弄清楚为什么这些元素没有被添加到无序列表中。

我确信Javascript代码中的评论已经足够,但如果不是,请随时向我提问。

非常感谢你的帮助:)。

1 个答案:

答案 0 :(得分:9)

您的for loop立即失败,因为i不大于100.如果你尝试这样的话,它应该有效:

for (var i = 100; i < 200; i++)

示例:http://jsfiddle.net/grc4/gc4X5/1/