Open In App

HTML DOM Source src Property

Last Updated : 22 Jun, 2023
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


Like Article
Suggest improvement
Share your thoughts in the comments

Similar Reads