Div добавлен с JavaScript не отображается

Question

Div добавлен с JavaScript не отображается

0

Я пытаюсь добавить div с помощью javascript. Div появляется в коде и в инструментах разработчика chromes, но не отображается в фактическом окне?

Почему это происходит, как я могу это исправить?

Код:

<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>

moonshineOutlaw 19 дек. 2013, в 15:37

Источник

0

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

Теги:

javascript

html

2 ответа

0

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

вам нужно добавить 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>

Fox 19 дек. 2013, в 12:50

Ещё вопросы

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

CodingIntrigue · Accepted Answer · 2013-12-19T13-10-00.000Z

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

div.style.backgroundColor = 'blue';

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