The HTML DOM Image src Property is used to set or returns the value of the src attribute of the <img> element. This attribute is used to specify the URL of the Image.
Syntax:
-
Returns the image src property.
imageObject.src
-
Set the image src property.
imageObject.src = URL
Property Values: It contains a single value URL that specifies the URL of the document that is embedded in the Image. There are two types of URL links which are listed below:
- Absolute URL: It points to another webpage.
- Relative URL: It points to other files of the same web page.
Return value: It returns a string value that represents the URL of the image.
Example: Below code returns the src Property.
HTML
<!DOCTYPE html> <html>
<body>
<center>
<h1 style="color: green">
GeeksforGeeks
</h1>
<h2>HTML DOM Image src Property</h2>
<img id="GFG" src=
width="400" height="150" />
<br>
<button onclick="Geeks()">
Click me!
</button>
<p id="sudo"></p>
</center>
<script>
function Geeks() {
var g = document.getElementById("GFG").src;
document.getElementById("sudo").innerHTML = g;
}
</script>
</body>
</html>
|
Output:
Example 2: This example sets the src property.
HTML
<!DOCTYPE html> <html>
<body>
<center>
<h1 style="color: green">GeeksforGeeks</h1>
<h2>HTML DOM Image src Property</h2>
<img id="GFG" src=
width="400" height="150" />
<br>
<button onclick="Geeks()">Click me!</button>
<p id="sudo"></p>
</center>
<script>
function Geeks() {
var g = document.getElementById("GFG").src =
document.getElementById("sudo").innerHTML = g;
}
</script>
</body>
</html>
|
Output:
Supported Browsers:
- Google Chrome
- Firefox
- Internet Explorer
- Opera
- Apple Safari