JavaScript में स्क्रिप्ट टैग का उपयोग

HTML <script> टैग

<script> टैग क्लाइंट-साइड JavaScript कोड को परिभाषित करता है या बाहरी स्क्रिप्ट फाइल को शामिल करता है।

विशेषताएं

• स्क्रिप्ट स्टेटमेंट्स या बाहरी फाइल (src एट्रिब्यूट) रखता है
• <head> या <body> में रखा जा सकता है
• JavaScript कोड script टैग के अंदर होना चाहिए

उदाहरण 1: स्क्रिप्ट टैग के बाहर वेरिएबल (गलत)

<html> <body> 
  <p id="demo"></p> 
  var a = 1;  <!-- स्क्रिप्ट टैग के बाहर -->
  <script>
    var b = 2;
    var c = a + b;  // a ग्लोबल स्कोप में है लेकिन...
    document.getElementById("demo").innerHTML = c;
  </script> </body> </html>

आउटपुट

var a = 1

समस्या: ब्राउज़र var a = 1 को टेक्स्ट के रूप में रेंडर करता है क्योंकि यह script टैग के बाहर है।

उदाहरण 2: स्क्रिप्ट टैग के अंदर वेरिएबल (सही)

<html> <body> 
  <p id="demo"></p> 
  <script>
    var a = 1;
    var b = 2;
    var c = a + b;
    document.getElementById("demo").innerHTML = c;
  </script> </body> </html>

आउटपुट

3

स्क्रिप्ट प्लेसमेंट विकल्प

आधुनिक एट्रिब्यूट्स

<!-- डिफ़ॉल्ट: पार्सिंग ब्लॉक करता है -->
<script src="app.js"></script>

<!-- async: समानांतर डाउनलोड, क्रम नहीं गारंटीड -->
<script src="analytics.js" async></script>

<!-- defer: समानांतर डाउनलोड, पार्सिंग के बाद क्रम में एक्सेक्यूट -->
<script src="app.js" defer></script>

<!-- मॉड्यूल (ES6) -->
<script type="module" src="main.js"></script>

सर्वोत्तम अभ्यास

• स्क्रिप्ट्स को <body> के अंत में या defer के साथ <head> में रखें
• बाहरी फाइल्स का उपयोग करें (कैशिंग, मेंटेनेंस)
• इनलाइन स्क्रिप्ट्स न्यूनतम रखें
• type="text/javascript" वैकल्पिक है (HTML5 में डिफ़ॉल्ट)