Question

我正在尝试在已存在的div内创建div的基本示例。

使用时似乎无法正常工作：

document.getElementbyId('lc').appendChild(element)

但是当我这样做时工作正常：

document.body.appendChild(element)

我是否需要添加windows.onload功能？虽然它甚至不起作用！

HTML code：

<body>
    <input id="filter" type="text" placeholder="Enter your filter text here.." onkeyup = "test()" />

    <div id="lc">  
    </div>
</body>

JS代码：

function test()
{
    var element = document.createElement("div");
    element.appendChild(document.createTextNode('The man who mistook his wife for a hat'));
    document.getElementbyId('lc').appendChild(element);
    //document.body.appendChild(element);
}

Answer 1

您的代码运行良好，您只需错误输入以下代码行：

document.getElementbyId('lc').appendChild(element);

改变它：

document.getElementById('lc').appendChild(element);

这是我的例子：

<html>
<head>

<script>

function test() {

    var element = document.createElement("div");
    element.appendChild(document.createTextNode('The man who mistook his wife for a hat'));
    document.getElementById('lc').appendChild(element);

}

</script>

</head>
<body>
<input id="filter" type="text" placeholder="Enter your filter text here.." onkeyup = "test()" />

<div id="lc" style="background: blue; height: 150px; width: 150px;
}" onclick="test();">  
</div>
</body>

</html>

Answer 2

'b'应该是document.getElementById修改后的代码jsfiddle

中的大写字母

function test()
{

var element = document.createElement("div");
element.appendChild(document.createTextNode('The man who mistook his wife for a hat'));
document.getElementById('lc').appendChild(element);
 //document.body.appendChild(element);
 }

Answer 3

是的，您需要在结束onload标记后<{1}}元素<script>或</body>标记中执行此操作已在文档的DOM树中找到。

在javascript中的div元素内创建div元素

3 个答案: