This post serves the following learning outcomes:
The description of the parameters is as follows:
- myImageId: specifies the image id.
- src: refers to the source of the image.
Example 1: Change Image Source of the Local Image
In this code, the changeSrc() method fetches the element using its id “imgid” and sets the value of the “src” attribute of that element.
The output shows that after pressing the “Change Image Button” the source file of the image is changed, and the new image is displayed.
Example 2: Change Image Source of a Web-Based Image
The description of the code is as below:
- Firstly, the width and height of the image are assigned to the image within <img> tags.
- After that, the URL of an image is provided by the src property to display the image in the browser window.
In this code, the changeScr() method is used to trigger an event when the user clicks on the button to change the source of the image.
The output illustrates that when a user clicks on the “Change Image”, the new image is replaced with the existing one.