Skip to content
Related Articles

Related Articles

HTML | DOM scripts Collection

View Discussion
Improve Article
Save Article
  • Last Updated : 16 Jun, 2022

The DOM scripts Collection in HTML is used to return the collection of all <script> element in HTML document. The script elements are sorted as appear in the sourcecode. 

Syntax:

document.scripts

Property Value: It returns the single value length which is the collection of all script element. 

Method:

  • [index]: It is used to return the <script> element of selected index. The index value starts with 0. It returns NULL if the index value is out of range.
  • item(index): It is used to return the <script> element of selected index. The index value starts with 0. It returns NULL if the index value is out of range.
  • namedItem(id): It is used to return the <script> element from the collection with given id attribute. It returns NULL if the id is not valid.

Example 1: 

html




<!DOCTYPE html>
<html>
    <head>
        <title>DOM scripts collection</title>
         
        <style>
            .gfg {
                font-size:40px;
                font-weight:bold;
                color:green;
            }
            body {
                text-align:center;
                font-family:Times;
            }
        </style>
    </head>
     
    <body>
        <a name="" class="gfg">GeeksforGeeks</a>
         
        <h2>DOM scripts Collection</h2>
         
        <!-- script content -->
        <script>
            document.write("GeeksForGeeks");
        </script><br><br>
         
        <button onclick="Geeks()">Submit</button>
         
        <p id="sudo"></p>
         
        <!-- script content -->
        <script>
            function Geeks() {
                var x = document.scripts.length;
                document.getElementById("sudo").innerHTML =
                "Number of scripts elements: " + x;
            }
        </script>
         
    </body>
</html>                                

Output: Before Click on the button:

  

After Click on the button:

  

Example 2: 

html




<!DOCTYPE html>
<html>
    <head>
        <title>DOM scripts collection</title>
         
        <style>
            .gfg {
                font-size:40px;
                font-weight:bold;
                color:green;
            }
            body {
                text-align:center;
                font-family:Times;
            }
        </style>
    </head>
     
    <body>
        <a name="" class="gfg">GeeksforGeeks</a>
         
        <h2>DOM scripts Collection</h2>
         
        <!-- script content -->
        <script>
            document.write("GeeksForGeeks");
        </script><br><br>
         
        <button onclick = "Geeks()">Submit</button>
         
        <p id="sudo"></p>
         
        <!-- script content -->
        <script>
            function Geeks() {
                var x = document.scripts[0].text;;
                document.getElementById("sudo").innerHTML =
                "First script Element: " + x;
            }
        </script>
         
    </body>
</html>                                        

Output: Before Click on the button:

  

After Click on the button:

  

Supported Browsers: The browser supported by DOM scripts collection are listed below:

  • Google Chrome 1 and above
  • Edge 12 and above
  • Internet Explorer 4 and above
  • Firefox 9.0 and above
  • Opera 12.1 and above
  • Safari 3 and above

My Personal Notes arrow_drop_up
Recommended Articles
Page :

Start Your Coding Journey Now!