HTML - जावास्क्रिप्ट

ए scriptकार्यक्रम का एक छोटा सा टुकड़ा है जो आपकी वेबसाइट में अन्तरक्रियाशीलता जोड़ सकता है। उदाहरण के लिए, एक स्क्रिप्ट पॉप-अप अलर्ट बॉक्स संदेश उत्पन्न कर सकती है, या ड्रॉपडाउन मेनू प्रदान कर सकती है। यह स्क्रिप्ट जावास्क्रिप्ट या VBScript का उपयोग करके लिखी जा सकती है।

आप किसी भी स्क्रिप्टिंग भाषा का उपयोग करके इवेंट हैंडलर नामक विभिन्न छोटे कार्य लिख सकते हैं और फिर आप HTML विशेषताओं का उपयोग करके उन फ़ंक्शन को ट्रिगर कर सकते हैं।

अब-केवल दिन, केवल JavaScript और अधिकांश वेब डेवलपर्स द्वारा संबंधित फ्रेमवर्क का उपयोग किया जा रहा है, VBScript विभिन्न प्रमुख ब्राउज़रों द्वारा भी समर्थित नहीं है।

आप जावास्क्रिप्ट कोड को एक अलग फ़ाइल में रख सकते हैं और फिर इसे जहाँ भी आवश्यक हो, या HTML दस्तावेज़ के अंदर कार्यक्षमता को परिभाषित कर सकते हैं। आइए उपयुक्त उदाहरणों के साथ दोनों मामलों को एक-एक करके देखें।

बाहरी जावास्क्रिप्ट

यदि आप एक कार्यक्षमता को परिभाषित करने जा रहे हैं जिसका उपयोग विभिन्न HTML दस्तावेज़ों में किया जाएगा तो उस कार्यक्षमता को एक अलग जावास्क्रिप्ट फ़ाइल में रखना बेहतर होगा और फिर उस फ़ाइल को अपने HTML दस्तावेज़ों में शामिल करें। एक जावास्क्रिप्ट फ़ाइल के रूप में विस्तार होगा.js और इसे <script> टैग का उपयोग करके HTML फ़ाइलों में शामिल किया जाएगा।

उदाहरण

विचार करें कि हम जावास्क्रिप्ट का उपयोग करके एक छोटे से फ़ंक्शन को परिभाषित करते हैं script.js जिसका कोड निम्नलिखित है -

function Hello() {
   alert("Hello, World");
}

अब हमारे निम्नलिखित HTML दस्तावेज़ में उपरोक्त बाहरी जावास्क्रिप्ट फ़ाइल का उपयोग करते हैं -

<!DOCTYPE html>
<html>

   <head>
      <title>Javascript External Script</title>
      <script src = "/html/script.js" type = "text/javascript"/></script>
   </head>

   <body>
      <input type = "button" onclick = "Hello();" name = "ok" value = "Click Me" />
   </body>

</html>

यह निम्नलिखित परिणाम देगा, जहाँ आप दिए गए बटन पर क्लिक करने का प्रयास कर सकते हैं -

आंतरिक स्क्रिप्ट

आप अपने स्क्रिप्ट कोड को सीधे अपने HTML डॉक्यूमेंट में लिख सकते हैं। आमतौर पर हम <script> टैग का उपयोग करके दस्तावेज़ के हेडर में स्क्रिप्ट कोड रखते हैं, अन्यथा कोई प्रतिबंध नहीं है और आप दस्तावेज़ में कहीं भी अपना स्रोत कोड डाल सकते हैं लेकिन <script> टैग के अंदर।

उदाहरण

<!DOCTYPE html>
<html>

   <head>
      <title>JavaScript Internal Script</title>
      <base href = "https://www.tutorialspoint.com/" />
      
      <script type = "text/JavaScript">
         function Hello() {
            alert("Hello, World");
         }
      </script>
   </head>

   <body>
      <input type = "button" onclick = "Hello();" name = "ok" value = "Click Me" />
   </body>

</html>

इवेंट हैंडलर

इवेंट हैंडलर कुछ भी नहीं हैं, बस परिभाषित फ़ंक्शन हैं जिन्हें किसी भी माउस या कीबोर्ड इवेंट के खिलाफ कहा जा सकता है। आप अपने ईवेंट हैंडलर के अंदर अपने व्यावसायिक तर्क को परिभाषित कर सकते हैं जो कि एक सिंगल से लेकर लाइन कोड तक भिन्न हो सकते हैं।

निम्नलिखित उदाहरण बताते हैं कि कैसे एक घटना हैंडलर लिखने के लिए। दस्तावेज़ के हेडर में एक साधारण फ़ंक्शन EventHandler () लिखें । जब कोई भी उपयोगकर्ता एक पैराग्राफ पर माउस लाता है, तो हम इस फ़ंक्शन को कॉल करेंगे।

<!DOCTYPE html>
<html>

   <head>
      <title>Event Handlers Example</title>
      <base href = "https://www.tutorialspoint.com/" />
      
      <script type = "text/JavaScript">
         function EventHandler() {
            alert("I'm event handler!!");
         }
      </script>
   </head>

   <body>
      <p onmouseover = "EventHandler();">Bring your mouse here to see an alert</p>
   </body>

</html>

अब यह निम्नलिखित परिणाम देगा। इस लाइन पर अपना माउस लाएँ और परिणाम देखें -

पुराने ब्राउज़रों से लिपियों को छिपाएँ

हालाँकि इन दिनों अधिकांश (यदि सभी नहीं) ब्राउज़र जावास्क्रिप्ट का समर्थन करते हैं, लेकिन फिर भी कुछ पुराने ब्राउज़र नहीं हैं। यदि कोई ब्राउज़र आपकी स्क्रिप्ट चलाने के बजाय जावास्क्रिप्ट का समर्थन नहीं करता है, तो यह उपयोगकर्ता को कोड प्रदर्शित करेगा। इसे रोकने के लिए, आप स्क्रिप्ट के चारों ओर HTML टिप्पणियों को नीचे दिखाए अनुसार रख सकते हैं।

JavaScript Example:
<script type = "text/JavaScript">
   <!--
      document.write("Hello JavaScript!");
   //-->
</script>

VBScript Example:
<script type = "text/vbscript">
   <!--
      document.write("Hello VBScript!")
   '-->
</script>

<Noscript> तत्व

आप उन उपयोगकर्ताओं को वैकल्पिक जानकारी भी प्रदान कर सकते हैं जिनके ब्राउज़र स्क्रिप्ट का समर्थन नहीं करते हैं और उन उपयोगकर्ताओं के लिए जिनके पास स्क्रिप्ट अक्षम है, अपने ब्राउज़र का विकल्प चुनते हैं। आप इसका उपयोग कर सकते हैं<noscript> टैग।

JavaScript Example:
<script type = "text/JavaScript">
   <!--
      document.write("Hello JavaScript!");
   //-->
</script>

<noscript>Your browser does not support JavaScript!</noscript>

VBScript Example:
<script type = "text/vbscript">
   <!--
      document.write("Hello VBScript!")
   '-->
</script>

<noscript>Your browser does not support VBScript!</noscript>

डिफ़ॉल्ट स्क्रिप्टिंग भाषा

ऐसी स्थिति हो सकती है जब आप कई स्क्रिप्ट फ़ाइलों को शामिल करेंगे और अंततः कई <स्क्रिप्ट> टैग का उपयोग करेंगे। आप अपने सभी स्क्रिप्ट टैग के लिए एक डिफ़ॉल्ट स्क्रिप्टिंग भाषा निर्दिष्ट कर सकते हैं । यह आपको पृष्ठ के भीतर स्क्रिप्ट टैग का उपयोग करने पर हर बार भाषा को निर्दिष्ट करने से बचाता है। नीचे उदाहरण है -

<meta http-equiv = "Content-Script-Type" content = "text/JavaScript" />

ध्यान दें कि आप अभी भी स्क्रिप्ट टैग के भीतर किसी भाषा को निर्दिष्ट करके डिफ़ॉल्ट को ओवरराइड कर सकते हैं।