div添加javascript并不显示

我想添加一个使用javascript的div。该div出现在代码和chromes开发人员工具中，但未显示在实际窗口中？div添加javascript并不显示

为什么会发生这种情况，我该如何解决这个问题？

代码：

<div id='body'> 
    <div id='inner'>div here</div> 
</div> 

<script> 

function add() { 
var inner = document.getElementById('inner'); 

    var div = document.createElement('div'); 
    div.style.height = '300px'; 
    div.style.width = '100px'; 
    div.style.color = 'blue'; 
    inner.appendChild(div); 

} 

add(); 



</script>

来源

2013-12-19 moonshineOutlaw

颜色用于文本，而不是为背景。请参阅http://jsfiddle.net/er779/3/ – Reinard

您已设置文本color，没有背景色。所以它就在那里，只是它没有内容，所以你看不到它。我假设你的意思是这样的：

div.style.backgroundColor = 'blue';

来源

2013-12-19 14:20:41 CodingIntrigue

基于这是答案，我建议OP使用检查器工具来查看DOM来捕捉这类事情。 –

试试这段代码，它对我有用。

你必须添加的onload（）在body标签

<html> 
<head> 
<script> 
function add() { 

var inner = document.getElementById('inner'); 
var div = document.createElement("div"); 
div.style.width = "300px"; 
div.style.height = "100px"; 
div.style.background = "blue"; 


inner.appendChild(div); 
} 

</script> 
</head> 

<body onload ="add()"> 

<div id="inner"></div> 

</body> 
</html>

来源

2013-12-19 14:41:05 Fox

div添加javascript并不显示

回答

相关问题