JS dynamically modifies the image of the URL (src) method

  • 2020-05-26 07:41:12
  • OfStack

The example in this article shows how JS dynamically modifies URL (src) of a picture. Share with you for your reference. The details are as follows:

The JS code below dynamically changes the image address to display a new image, actually by changing the src property of the image


<!DOCTYPE html>
<html>
<head>
<script>
function changeSrc()
{
document.getElementById("myImage").src="hackanm.gif";
}
</script>
</head>
<body>
<img id="myImage" src="compman.gif" width="107" height="98">
<br><br>
<input type="button" onclick="changeSrc()" value="Change image">
<p><b>Note:</b> The src property can be changed at any time. 
However, the new image inherits the height and width
attributes of the original image,
if not new height and width properties are specified.</p>
</body>
</html>

I hope this article has helped you with your javascript programming.


Related articles: