Computer >> कंप्यूटर ट्यूटोरियल >  >> प्रोग्रामिंग >> HTML

HTML मार्कअप में <script> टैग कहाँ रखना चाहिए?


परिचय

JavaScript कोड को HTML में <script> और </script> टैग के बीच डाला जाता है। आप <script> टैग को अपने वेब पेज पर कहीं भी रख सकते हैं, लेकिन आमतौर पर इसे <head> टैग के अंदर रखने की सलाह दी जाती है।

<script> टैग कैसे काम करता है

<script> टैग ब्राउज़र को निर्देश देता है कि इन टैग के बीच के सभी टेक्स्ट को स्क्रिप्ट के रूप में व्याख्या करना शुरू करे।

महत्वपूर्ण एट्रिब्यूट्स

  • Language - यह एट्रिब्यूट बताता है कि आप किस स्क्रिप्टिंग भाषा का उपयोग कर रहे हैं। आमतौर पर इसका मान JavaScript होता है। हालांकि HTML के हालिया संस्करणों (और XHTML, इसके उत्तराधिकारी) में इस एट्रिब्यूट का उपयोग बंद कर दिया गया है।
  • Type - यह एट्रिब्यूट अब स्क्रिप्टिंग भाषा को इंगित करने के लिए अनुशंसित है और इसका मान "text/javascript" पर सेट होना चाहिए।

उदाहरण: "Hello World" प्रिंट करना

आइए एक सरल उदाहरण देखते हैं जो "Hello World" प्रिंट करता है। हमने एक वैकल्पिक HTML टिप्पणी जोड़ी है जो हमारे JavaScript कोड को घेरती है। यह उन ब्राउज़रों से हमारे कोड को बचाने के लिए है जो JavaScript का समर्थन नहीं करते। टिप्पणी "//-->" के साथ समाप्त होती है। यहां "//" JavaScript में एक टिप्पणी को दर्शाता है, इसलिए हम इसे HTML टिप्पणी के अंत को JavaScript कोड के टुकड़े के रूप में पढ़ने से रोकने के लिए जोड़ते हैं। इसके बाद, हम document.write फ़ंक्शन को कॉल करते हैं जो हमारे HTML दस्तावेज़ में एक स्ट्रिंग लिखता है।

यह फ़ंक्शन टेक्स्ट, HTML, या दोनों को लिखने के लिए उपयोग किया जा सकता है। निम्नलिखित कोड देखें:

कोड उदाहरण

<html>    <body>       <script language="javascript" type="text/javascript">          <!--             document.write("Hello World!")          //-->       </script>    </body> </html>

आउटपुट

Hello World!

आधुनिक सर्वोत्तम अभ्यास

  • स्क्रिप्ट को <body> के अंत में रखें - इससे पेज तेजी से लोड होता है क्योंकि HTML कंटेंट पहले रेंडर होता है
  • defer एट्रिब्यूट का उपयोग करें - <script src="script.js" defer></script> से स्क्रिप्ट HTML पार्स होने के बाद चलती है
  • async एट्रिब्यूट का उपयोग करें - <script src="script.js" async></script> से स्क्रिप्ट असिंक्रोनसली लोड होती है
  • type="text/javascript" अब वैकल्पिक है क्योंकि यह डिफ़ॉल्ट है
  • HTML कमेंट रैपर (<!-- -->) अब आवश्यक नहीं हैं

सारांश

प्लेसमेंटउपयोग का मामला
<head> मेंछोटे स्क्रिप्ट्स, लाइब्रेरी लोड करना, defer के साथ
<body> के अंत मेंअधिकांश स्क्रिप्ट्स के लिए सर्वोत्तम (अनुशंसित)
इंलाइन (आवश्यकतानुसार)छोटे इवेंट हैंडलर्स, इंलाइन कॉन्फ़िगरेशन
  1. HTML <script> charset एट्रिब्यूट HTML <script> charset एट्रिब्यूट

    <script> एलिमेंट का charset एट्रिब्यूट <script> एलिमेंट का charset एट्रिब्यूट वर्ण एन्कोडिंग (character encoding) सेट करने के लिए उपयोग किया जाता है, जिसका उपयोग एक बाहरी स्क्रिप्ट फ़ाइल में किया जाता है। वाक्यविन्यास (Syntax) <script charset=charset> ऊपर, charset सेट करें, जो बा

  1. HTML DOM Script ऑब्जेक्ट HTML DOM Script ऑब्जेक्ट

    Script ऑब्जेक्ट क्या है? HTML DOM Script ऑब्जेक्ट HTML दस्तावेज़ में <script> तत्व को दर्शाता है। यह जावास्क्रिप्ट कोड को एम्बेड करने या बाहरी स्क्रिप्ट फ़ाइलों को संदर्भित करने के लिए उपयोग किया जाता है। DOM के माध्यम से, आप डायनामिक रूप से स्क्रिप्ट तत्व बना सकते हैं, संशोधित कर सकते हैं और

  1. HTML DOM scripts कलेक्शन HTML DOM scripts कलेक्शन

    scripts कलेक्शन क्या है? HTML DOM scripts कलेक्शन एक HTMLCollection है जो दस्तावेज़ में सभी <script> तत्वों को क्रम में रखता है। यह document.scripts प्रॉपर्टी के माध्यम से पहुँच योग्य है और आपको पेज पर सभी स्क्रिप्ट तत्वों को गिनने, एक्सेस करने और पुनरावृत्त करने की अनुमति देता है। सिंटैक्स