2013-12-19 2 views
0

Я пытаюсь добавить div с помощью javascript. 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> 
+0

цвет используется для текста, а не для фона. см. http://jsfiddle.net/er779/3/ – Reinard

ответ

5

Вы установили текст color, а не цвет фона. Так оно и есть, просто у него нет контента, чтобы вы его не видели. Я предполагаю, что вы имели в виду это:

div.style.backgroundColor = 'blue'; 
+2

Исходя из этого, я бы рекомендовал OP посмотреть DOM с помощью инспекторского инструмента, чтобы поймать подобное. –

0

Попробуйте этот код, он работает на меня.

вы должны добавить OnLoad() в теге тела

<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> 
Смежные вопросы