scripts कलेक्शन क्या है?
HTML DOM scripts कलेक्शन एक HTMLCollection है जो दस्तावेज़ में सभी <script> तत्वों को क्रम में रखता है। यह document.scripts प्रॉपर्टी के माध्यम से पहुँच योग्य है और आपको पेज पर सभी स्क्रिप्ट तत्वों को गिनने, एक्सेस करने और पुनरावृत्त करने की अनुमति देता है।
सिंटैक्स
document.scriptsप्रॉपर्टीज़
| प्रॉपर्टी | विवरण |
|---|---|
length |
कलेक्शन में <script> तत्वों की संख्या लौटाता है। |
मेथड्स
| मेथड | विवरण |
|---|---|
[index] |
निर्दिष्ट इंडेक्स पर <script> तत्व लौटाता है (0-आधारित)। |
item(index) |
[index] के समान; निर्दिष्ट इंडेक्स पर तत्व लौटाता है। |
namedItem(id) |
निर्दिष्ट id वाले <script> तत्व को लौटाता है। |
उदाहरण
यह उदाहरण पेज पर स्क्रिप्ट तत्वों की संख्या गिनता है और प्रदर्शित करता है:
<!DOCTYPE html>
<html>
<head>
<style>
html { height: 100%; }
body {
text-align: center;
color: #fff;
background: linear-gradient(62deg, #FBAB7E 0%, #F7CE68 100%) center/cover no-repeat;
height: 100%;
}
p { font-weight: 700; font-size: 1.2rem; }
ul { list-style-type: none; padding: 0; }
.btn {
background: #0197F6;
border: none;
height: 2rem;
border-radius: 2px;
width: 50%;
margin: 2rem auto;
display: block;
color: #fff;
outline: none;
cursor: pointer;
}
.show { font-size: 1.5rem; font-weight: bold; }
</style>
</head>
<body>
<script> console.log("स्क्रिप्ट एक"); </script>
<h1>DOM scripts कलेक्शन डेमो</h1>
<p>नमस्ते, इस पेज पर दो स्क्रिप्ट तत्व हैं:</p>
<script> console.log("स्क्रिप्ट दो"); </script>
<button onclick="show()" class="btn">स्क्रिप्ट की संख्या दिखाएं</button>
<div class='show'></div>
<script>
function show() {
var scriptList = document.scripts;
document.querySelector(".show").innerHTML = "कुल स्क्रिप्ट तत्व: " + scriptList.length;
}
</script>
</body>
</html>आउटपुट
"स्क्रिप्ट की संख्या दिखाएं" बटन पर क्लिक करने पर, पेज पर मौजूद सभी <script> तत्वों की संख्या प्रदर्शित होती है (इस उदाहरण में 3: दो हेड/बॉडी में और एक इवेंट हैंडलर में)।
उपयोग के मामले
- पेज पर लोड किए गए स्क्रिप्ट्स की संख्या गिनने के लिए।
- विशिष्ट
idवाले स्क्रिप्ट तत्व को खोजने के लिए (namedItem())। - सभी स्क्रिप्ट्स पर पुनरावृत्ति करके उनके
src,type, याasync/deferविशेषताओं का निरीक्षण करने के लिए। - डायनामिक रूप से लोड किए गए स्क्रिप्ट्स का पता लगाने के लिए।
नोट्स
- कलेक्शन लाइव है - डायनामिक रूप से जोड़े/हटाए गए स्क्रिप्ट तत्व स्वचालित रूप से प्रतिबिंबित होते हैं।
- इंलाइन स्क्रिप्ट्स और बाहरी स्क्रिप्ट्स दोनों शामिल हैं।
- आधुनिक कोड में, आप
Array.from(document.scripts)या[...document.scripts]का उपयोग करके इसे सरणी में बदल सकते हैं।
