Open In App

HTML DOM scripts Collection

Improve
Improve
Like Article
Like
Save
Share
Report

The DOM scripts Collection in HTML is used to return the collection of all <script> elements in an 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 elements. 

Method:

  • [index]: It is used to return the <script> element of the 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 the given id attribute. It returns NULL if the id is not valid.

Example 1: In this example, we will use DOM scripts Collection.

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() {
            let x = document.scripts.length;
            document.getElementById("sudo").innerHTML =
                "Number of scripts elements: " + x;
        }
    </script>
</body>
</html>


Output: 

 

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() {
            let x = document.scripts[0].text;;
            document.getElementById("sudo").innerHTML =
                "First script Element: " + x;
        }
    </script>
</body>
</html>


Output: 

 

 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


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