HTML | DOM Source src Property

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

Syntax:

It return the Source src property.
```
 sourceObject.src
```
It is used to set the Source src property.
```
sourceObject.src = URL 
```

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

Return Value: It returns a string value which represents the URL of the media resource.

Example 1: This example returns the Source src Property.

<!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() { 
  
            var x = document.getElementById("mySource").src; 
            document.getElementById("demo").innerHTML = x; 
        } 
    </script> 
  
</body> 
  
</html> 
                    

Output:
Before Clicking on Button:

After Clicking on Button:

Example 2: This example sets the Source src property.

<!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() { 
  
            var x = document.getElementById("mySource").type = "gameover.wav"; 
            document.getElementById("demo").innerHTML =  
             "The source src has been changed to " +x; 
        } 
    </script> 
  
</body> 
  
</html>                     

Output:
Before Clicking on Button:

After Clicking on Button:

Supported Browsers:

Google Chrome
Firefox
Internet Explorer
Opera
Safari

My Personal Notes

Recommended Posts: