joh*_*ohn 19 html javascript dom
我想用JavaScript添加一个元素.
我有以下代码:
var collection = document.getElementsByTagName('body');
var a = document.createElement('div');
a.innerHTML = 'some text';
collection.item(0).firstChild.appendChild(a);
Run Code Online (Sandbox Code Playgroud)
和简单的HTML:
<html>
<head></head>
<body>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)
哪里出错?
nai*_*sts 31
这应该做你想要的:
var newdiv = document.createElement("div");
newdiv.appendChild(document.createTextNode("some text"));
document.body.appendChild(newdiv);
Run Code Online (Sandbox Code Playgroud)
首先,您创建元素document.createElement
.要设置其文本内容,您必须有一个"文本节点"包装文本.因此,首先创建此类文本节点,然后将其作为(唯一)子项添加到新对象中.
然后,将新创建的DIV元素添加到DOM结构中.您不必查找BODY元素getElementsByTagName()
,因为它作为document
对象的属性存在.
您的代码失败,因为在您尝试插入该全新div时,body标记为空,因此没有firstChild可以附加任何内容.将您的最后一行更改为:
collection.item(0).appendChild(a);
Run Code Online (Sandbox Code Playgroud)