JavaScript - Placement in HTML File
जावास्क्रिप्ट - एचटीएमएल फाइल में प्लेसमेंट
HTML दस्तावेज़ में कहीं भी जावास्क्रिप्ट कोड शामिल करने के लिए लचीलापन दिया गया है। हालाँकि HTML फ़ाइल में जावास्क्रिप्ट को शामिल करने के सबसे पसंदीदा तरीके इस प्रकार हैं -
- <head>...</head> अनुभाग में स्क्रिप्ट।
- <body>...
</body> अनुभाग में स्क्रिप्ट। - <body>...</body> और <head>...</head> अनुभागों में स्क्रिप्ट।
- किसी बाहरी फ़ाइल में स्क्रिप्ट और फिर <head>...</head> अनुभाग में शामिल करें।
निम्नलिखित अनुभाग में, हम देखेंगे कि कैसे हम जावास्क्रिप्ट को एक HTML फ़ाइल में विभिन्न तरीकों से रख सकते हैं।
<head>...</head> अनुभाग में JavaScript
यदि आप किसी ईवेंट पर स्क्रिप्ट चलाना चाहते हैं, जैसे कि जब कोई उपयोगकर्ता कहीं क्लिक करता है, तो आप उस स्क्रिप्ट को हेड में इस प्रकार रखेंगे -
<html>
<head>
<script type = "text/javascript">
<!--
function sayHello() {
alert("Hello World")
}
//-->
</script>
</head>
<body>
<input type = "button" onclick = "sayHello()" value = "Say Hello" />
</body>
</html>
यह कोड निम्नलिखित परिणाम देगा -
Hello World
<body>...</body> अनुभाग में JavaScript
यदि आपको पृष्ठ लोड होने पर चलाने के लिए एक स्क्रिप्ट की आवश्यकता है ताकि स्क्रिप्ट पृष्ठ में सामग्री उत्पन्न करे, तो स्क्रिप्ट दस्तावेज़ के <body> भाग में चली जाती है। इस मामले में, आपके पास जावास्क्रिप्ट का उपयोग करके परिभाषित कोई फ़ंक्शन नहीं होगा। निम्नलिखित कोड पर एक नज़र डालें।
<html>
<head>
</head>
<body>
<script type = "text/javascript">
<!--
document.write("Hello World")
//-->
</script>
<p>This is web page body </p>
</body>
</html>
यह कोड निम्नलिखित परिणाम देगा -
Hello World
This is web page body
<body> और <head> अनुभागों में JavaScript
आप अपना JavaScript कोड <head> और <body> सेक्शन में पूरी तरह से इस प्रकार रख सकते हैं -
<html>
<head>
<script type = "text/javascript">
<!--
function sayHello() {
alert("Hello World")
}
//-->
</script>
</head>
<body>
<script type = "text/javascript">
<!--
document.write("Hello World")
//-->
</script>
<input type = "button" onclick = "sayHello()" value = "Say Hello" />
</body>
</html>
यह कोड निम्नलिखित परिणाम देगा -
Hello World
बाहरी फ़ाइल में जावास्क्रिप्ट
जैसे ही आप जावास्क्रिप्ट के साथ अधिक व्यापक रूप से काम करना शुरू करते हैं, आप पाएंगे कि ऐसे मामले हैं जहां आप साइट के एकाधिक पृष्ठों पर समान जावास्क्रिप्ट कोड का पुन: उपयोग कर रहे हैं।
आप एकाधिक HTML फ़ाइलों में समान कोड बनाए रखने के लिए प्रतिबंधित नहीं हैं। स्क्रिप्ट टैग आपको एक बाहरी फ़ाइल में जावास्क्रिप्ट को संग्रहीत करने और फिर इसे अपनी HTML फ़ाइलों में शामिल करने की अनुमति देने के लिए एक तंत्र प्रदान करता है।
यह दिखाने के लिए यहां एक उदाहरण दिया गया है कि आप स्क्रिप्ट टैग और इसकी src विशेषता का उपयोग करके अपने HTML कोड में एक बाहरी जावास्क्रिप्ट फ़ाइल कैसे शामिल कर सकते हैं।
<html>
<head>
<script type = "text/javascript" src = "filename.js" ></script>
</head>
<body>
.......
</body>
</html>
किसी बाहरी फ़ाइल स्रोत से जावास्क्रिप्ट का उपयोग करने के लिए, आपको अपने सभी जावास्क्रिप्ट स्रोत कोड को ".js" एक्सटेंशन के साथ एक साधारण टेक्स्ट फ़ाइल में लिखना होगा और फिर उस फ़ाइल को ऊपर दिखाए अनुसार शामिल करना होगा।
उदाहरण के लिए, आप निम्न सामग्री को filename.js फ़ाइल में रख सकते हैं और फिर आप filename.js फ़ाइल को शामिल करने के बाद अपनी HTML फ़ाइल में SayHello फ़ंक्शन का उपयोग कर सकते हैं।
function sayHello() {
alert("Hello World")
}
