Javascript中的简单createElement问题

Question

我以为以下脚本会创建div元素，但我的html中没有任何输出。谁能帮我？多谢。

var div=document.createElement('div');
div.setAttribute('id','testttttttt');
div.innerHTML='fjsoidfjiosdjfoi';​

Answer 1

你的HTML中什么也得不到，因为你的HTML在服务器上。

您在 DOM 中什么也得不到，因为您尚未将元素添加到 DOM 中。

document.body.appendChild(div);

Answer 2

最后你必须使用appendChild方法：

var div=document.createElement('div');
div.setAttribute('id','testttttttt');
div.innerHTML='fjsoidfjiosdjfoi';​
document.body.appendChild(div);

否则，创建的元素将存在，但不会出现在您的页面中。

此外，您必须确保document.body存在，否则它将抛出错误（如果此脚本将在加载时执行，请将其放入onload事件中）。

PS：你也可以附加到任何其他 DOM 元素：

document.getElementById('myDivHolder').appendChild(div);

JSFiddle 示例：http://jsfiddle.net/AkXTr/

Answer 3

除了创建元素之外，还必须将其插入到 DOM 中。您可以使用 appendChild() 方法将其添加到给定父元素的末尾：

var div=document.createElement('div');
div.setAttribute('id','testttttttt');
div.innerHTML='fjsoidfjiosdjfoi';
// Now, append it
document.getElementById('someOtherElement').appendChild(div);

Answer 4

您实际上需要将其附加到某些内容中;我猜document.body会做的。

var div = document.createElement('div');
div.id = 'testttttttt';
div.innerHTML = 'fjsoidfjiosdjfoi';​
document.body.appendChild(div);

但是，请确保在document.body实际存在时执行此操作，即在load事件中或在body元素本身中。

Answer 5

你正确地创建了div，只是它无处可去。它需要插入到文档中，例如

        var div=document.createElement('div');
        div.setAttribute('id','testttttttt');
        div.innerHTML='fjsoidfjiosdjfoi';
        document.getElementsByTagName("body")[0].appendChild(div);