How to load image on onload with javascript?

Question

I am new with HTML and JavaScript. I am trying to load image using onload event through JavaScript.

My code is as below:

<script>
 function createImage() {

        ('testimonialhulk').src='photo.jpg';
</script>

and the HTML is

<body onload="createImage()">

<div class="testimonialhulk">

</div>


</body>
</html>

I have to display image in div tag.

what are you using pure js or jquery...you have syntax errors with both html and js — RohitS
– RohitS, Commented Dec 4, 2016 at 13:10
thanks Jyothi but is thr any alternative??please suggest me what can i use there? — Prush
– Prush, Commented Dec 4, 2016 at 13:13
Do you just need one image to load? Per JBA's comment, you should use an <img> tag with the src attribute. Why does it need to be in a <div> tag? I would give the <img> tag an id, then reference it in your javascript (jQuery). — elPastor
– elPastor, Commented Dec 4, 2016 at 13:19

Adrian Christensen · Accepted Answer · 2016-12-04 14:29:30Z

1

This works in my jsfiddle

<body onload="createImage();">
    <div id="testimonialhulk">
        Hello
    </div>
</body>

Js:

function createImage() 
{
    var myElement = document.getElementById("testimonialhulk");
    myElement.style.backgroundImage = "url('https://placehold.it/350x150')";
}

JS fiddle https://jsfiddle.net/wuskc68d/1/

edited Dec 4, 2016 at 14:29

answered Dec 4, 2016 at 13:49

Adrian Christensen

197 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

posixpascal Over a year ago

I suggest renaming the variable to something other than x

Adrian Christensen Over a year ago

Changed it to myElement :)

maha lakshmi · Accepted Answer · 2016-12-04 13:17:27Z

0

Try this

function createImage() {
var par = document.getElementsByClassName("testimonialhulk")[0];
var img = document.createElement('img');
img.src = 'put path here';
par.appendChild(img);
}

or use <div id="testimonialhulk">

document.getElementById('testimonialhulk')
    .innerHTML = '<img src="imageName.png" />';

answered Dec 4, 2016 at 13:17

maha lakshmi

771 gold badge2 silver badges9 bronze badges

Collectives™ on Stack Overflow

How to load image on onload with javascript?

2 Answers 2

2 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related