我试图创建一个函数来创建一个 div
并设置它的样式,这里是代码:http://jsfiddle.net/NGnEd/5/ .
<script type="text/javascript">
var dom = {
// Build the main button
buildButton: function(){
// Create new DOM element - div
var button = document.createElement('div');
// Set element attribute
button.setAttribute('id', 'newElement');
// Style the element
button.style.width = "100px";
button.style.height = "100px";
// Add content
button.innerHTML = 'new Element';
// Print element
document.body.innerHTML += button;
}
}
</script>
<div onclick="dom.buildButton();">
The first div
</div>
它应该创建元素、设置样式、添加内容并打印它。但是它不起作用,我不知道原因。
有什么帮助吗?
最佳答案
您不能将 HTML 元素添加到字符串中。而不是
document.body.innerHTML += button;
尝试
document.body.appendChild(button);
此外,正如@Felix Kling 指出的那样,您错误地设置了 JSFiddle,因此 onclick="dom.buildButton"
不起作用。这里的工作示例:
关于JavaScript 动态创建一个 div,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/7785741/