All geek questions in one place

Why is my image not showing when I use Javascript innerHTML to call it?

I am new to Javascript and I was trying to do something. I am using a function to load an image inside a table using innerHTML. But the image does not appear if I do not cause a warning ("all") at the bottom of the function, and then appears while the warning is displayed. The code I use is similar to (the function is called from an external js file)

<script> function show(){ document.getElementById('imageHolder1').innerHTML="<a href="#"><img='photos/picture.jpg' border=0/></a>"; } </script> <body> <input name="b1" type="button" value="pics" onclick="show()"/> <table><td id='imageHolder1'>picture</td></table> </body> ``

I don’t understand why this does not work, all the examples that I looked at are similar, I do not see big differences. Even if I try to disable the tag, it does not work. Well any help is appreciated! Thanks in advance, and if you have any suggestions on how to do this (without jquery, since I'm still learning javascript), I would also appreciate it. Thanks again!

+6
source share
4 answers

You have an error in your line:

 document.getElementById('imageHolder1').innerHTML="<a href="#"><img='photos/picture.jpg' border=0/></a>";

Must read

 document.getElementById('imageHolder1').innerHTML="<a href='#'><img src='photos/picture.jpg' border=0/></a>";

(note the "replacement")

+4
source

There are a lot of bugs and lazy shortcuts in your code. I made a violin and had to fix a lot of places that look like very hasty work ... here is your violin, but play with some devotion: http://jsfiddle.net/uXpeK/

+2
source

you are not adding src image. and it should be href='#' should be like this

 function show(){ document.getElementById('imageHolder1').innerHTML="<a href='#'><img src='photos/picture.jpg' border='0'/></a>"; }
+1
source

Try to assign the image identifier to the image, and then use the following:

 function show(){ document.getElementById('image').src = 'photos/picture.jpg' }
+1
source

Source: https://habr.com/ru/post/909784/

More articles:


All Articles