Question

为什么以下代码不起作用？我正在尝试编写一个应用程序，它将根据用户输入生成一定数量的div。当我进入该应用程序的控制台时，并输入说：var i = document.getElementById("foo");它返回为空。

<div>
    <input type="number" id="foo" value="3"/>
</div>

<div>
    <script>
        var i = document.getElementById("foo");
        for (var num = 1; num <= i; num++) {
            document.write('<div id="' + i + '"> ... </div>');
        }
    </script>
</div>

Answer 1

阅读问题下的评论！

此外，创建适当的元素通常是件好事。

<div>
    <input type="number" id="foo" value="3"/>
</div>

<div>
    <script>
        var i = document.getElementById("foo").value;
        for (var num = 1; num <= i; num++) {
            var elem = document.createElement('div');
            elem.id  = 'elem' + num;
            elem.innerHTML = ' ... ';
            document.body.appendChild(elem)
        }
    </script>
</div>

FIDDLE

为什么document.getElementById在这里返回null？

1 个答案: