Open In App

HTML DOM Source src Property

Improve
Improve
Like Article
Like
Save
Share
Report

The Source src Property in HTML DOM is used to set or return the value of the src attribute in a <source> element. The src attribute is used to specify the URL of the media resource. 

Syntax:

  • It returns the Source src property.
 sourceObject.src
  • It is used to set the Source src property.
sourceObject.src = URL 

Property Values: It contains a single value URL that specifies the URL of the media resource. It can be either an absolute or a relative URL.

Two Possible Values: 

  • 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 media resource. 

Example 1: This example returns the Source src Property. 

HTML




<!DOCTYPE html>
<html>
 
<head>
    <style>
        body {
            text-align: center;
        }
 
        h1 {
            color: green;
        }
    </style>
</head>
 
<body>
    <h1>GeeksforGeeks</h1>
    <h2>HTML DOM Source src property</h2>
    <audio controls>
        <source id="mySource"
                src="gameover.wav"
                type="audio/mpeg">
        <source src="gameover.ogg"
                type="audio/ogg">
    </audio>
    <p>
          Click the button to get the
        source/src of the audio file.
      </p>
    <button onclick="myFunction()">
        Get Src
    </button>
    <p id="demo"></p>
   
    <script>
        function myFunction() {
            let x = document.getElementById("mySource").src;
            document.getElementById("demo").innerHTML = x;
        }
    </script>
</body>
</html>


Output: 

 

Example 2: This example sets the Source src property. 

HTML




<!DOCTYPE html>
<html>
 
<head>
    <style>
        body {
            text-align: center;
        }
        h1 {
            color: green;
        }
    </style>
</head>
 
<body>
    <h1>GeeksforGeeks</h1>
    <h2>HTML DOM Source src property</h2>
    <audio controls>
        <source id="mySource"
                src="gameover1.wav"
                type="audio/mpeg">
        <source src="gameover.ogg"
                type="audio/ogg">
    </audio>
 
    <p>
        Click the button to set the source
        src of the audio file.
      </p>
    <button onclick="myFunction()">
        Set Src
    </button>
    <p id="demo"></p>
 
    <script>
        function myFunction() {
            let x =
            document.getElementById("mySource").type = "gameover.wav";
            document.getElementById("demo").innerHTML =
                "The source src has been changed to " + x;
        }
    </script>
</body>
</html>


Output:

 

Supported Browsers:

  • Google Chrome
  • Firefox
  • Internet Explorer
  • Opera
  • Safari


Last Updated : 22 Jun, 2023
Like Article
Save Article
Previous
Next
Share your thoughts in the comments
Similar Reads