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.
<!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:
<!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