dynamically create an image and place it on a web page

[jaspe]

I need to dynamically generate an image and have it placed in a div on a web page. In my code i can create a new 'img' object and the DOM seems to know it is there, but it will not display on the page. I want to try to avoid actually having to place the "<img src"....."> tag in the HTML as it is supposed to be entirely dynamically generated and i never know what div tag it will fall into as there are many.

Here is a snippet of my code:

JAVASCRIPT SNIPPET
***************************************
var newImage = document.createElement('img');
newImage.src = "someimage.gif";
newImage.id = "image4";

// Attach that element to appropriate div square.
var my_div = document.getElementById("square" + i);
my_div.appendChild(newImage);


HTML SNIPPET
***************************************
<table style="margin-bottom:8px" cellspacing="0" cellpadding="0" border="0">
<tr>
<td width="44px" height="44px">
<div id="square0" class="lightSquare" >

</div>
</td>
....... (many table cells with div tags within - a grid)......
</tr>
</table>


Any suggestions?

[Batalf]

Hello jaspe,

Welcome to the forum

Your code looks perfectly fine to me. Have you tried your code in both Internet Explorer and Firefox.

Firefox won't show anything if the path to the image is missing. Internet Explorer on the other hand will show a broken image icon. If you only have tested this in FF, try it in IE.

Do you see any error messages?

I can't imagine more than two possible causes to this problem

1) The path to the image is wrong. It could be a different file name or the image could be located in another folder.

2) the variable "i" is not defined or the element with id square + i doesn't exists on the page.

[jaspe]

[slothy]

hee hee

the only good thing about IE is that it shows a broken link to an image )

in firefox YOU NEVER KNOW

By the way, for those of you fixated on IE... i have just tried the developer bar in IE....really good to use especially if you learning...

incorporates DOM Viewer, Colour Picker, validator amongst other things and a ruler!!! LAST ONE IS COOL and INDISPENSIBLE!!!

Firefox have all these as addons practically....but to sing Microsoft's praises in a very croaky voice .... worth trying out if you use IE



Click above for Microsoft Developer Toolbar.


Alex