Javascript-форум (https://javascript.ru/forum/)
-   Events/DOM/Window (https://javascript.ru/forum/events/)
-   -   Создать узел <img> внутри <div> (https://javascript.ru/forum/events/6066-sozdat-uzel-img-vnutri-div.html)

glutton 09.11.2009 14:00

Создать узел <img> внутри <div>
 
Здравствуйте! Помогите, пож., составить код для реализации следующей задачи - надо создать <img .../> внутри <div .../> так, чтобы потом по ID рисунка можно было играть с его свойствами через document.getElementById().

// Все DIV'ы изначально присутствуют в теле документа
<div id=img_container>
       <div>...</div>
       <div id=workimage>
             // Этот узел (рисунок) надо создать динамически
             <img id=img src='img.gif'>
       </div>
       <div>...</div>
</div>



Написал кучу кривого кода, ничего не работает так как мне надо - могу только DIV создать, а не <img>, для отчета приведу один пример? который не рабоает:

var div_container = document.getElementById('workimage');
var div_container_inside = document.createElement("div");
div_container.appendChild(div_container_inside);
div_container.firstChild.nodeValue.innerHTML = "<img id=img src='img.gif'>";

alexKniaz 09.11.2009 14:41

<script type="text/javascript">
function doExec(){
var block=document.createElement('div');
block.id='workimage';
var image=document.createElement('img');
image.src='http://javascript.ru/forum/images/ca_serenity/misc/logo.gif';
block.appendChild(image);
var obj=document.getElementById('img_container');
obj.appendChild(block);
}
</script>
<div id="img_container"></div>
<button onclick="doExec();">Добавить div и img</button><br />
<button onclick="window.alert(document.getElementById('img_container').innerHTML);">Посмотреть innerHTML</button>


Часовой пояс GMT +3, время: 07:28.