Please help me with this question I am trying to change the source of an image dynamically.
The easiest way to modify the content of an HTML element is by using the innerHTML property . The innerHTML property gets or sets the HTML or XML markup contained within the element.
JavaScript provides a src attribute to change the image source by specifying the path of the file. For instance, the getElementId() method is utilized to extract the HTML element through id, and then the src property will change the source image. After extraction, the new source image file is assigned.
Use id into img tag and getElementById method then assign imager source to set image src in JavaScript. document. getElementById('image'). src = 'http://yourImagePathHere';
You'll need to use javascript for this:
<img src="image1.jpg" id="myImage" />
<script type="text/javascript">
document.getElementById("myImage").src = "image2.jpg";
</script>
If this is the type of response you are looking for, then I would also like to extend an invitation to you to start checking out and javascript framework like jQuery, which makes this type of stuff much easier to do/manage. In jQuery, you can accomplish the same thing with the following code:
$("#myImage").attr("src", "image2.jpg");
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With