HTML DOM Source src Property

Last Updated : 22 Jun, 2023

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>