Skip to main content

जावास्क्रिप्‍ट सीखें हिन्‍दी में पाठ-8 (जावास्क्रिप्‍ट सेलेक्‍टर) - Learn JavaScript in Hindi Lesson 8 (JavaScript Selector)

By

    ।। जावास्क्रिप्‍ट सेलेक्‍टर ।।
       ||  JavaScript Selector  ||

जावास्क्रिप्‍ट सेलेक्‍टर वो कोडपंक्तियां होती हैं जिनसे हम जावास्क्रिप्‍ट में एचटीएमएल के एलीमेण्‍ट सेलेक्‍ट करके उनमें इच्‍छानुसार परिवर्तन कर सकते हैं ।

उदाहरण -

<!doctype html>
<head>
<title>Learn Js</title>
</head>
<body>
<p id="p1">This is a Paragraph </p>

<button onclick="changepara();">Click Me</button>
<script>
function changepara()
{
document.getElementById("p1").innerHTML = "The Paragraph Text will be Changed";
}
</script>
</body>
</html>

उपयुक्‍त उदाहरण में हमने एक पैराग्राफ बनाया है जिसकी आईडी पी1 रखी है । इस पैराग्राफ के अन्‍दर एक वाक्‍य लिखा है । पैराग्राफ के वाक्‍य को बदलने के लिये हमें पैराग्राफ को सेलेक्‍ट करना है जिसके लिये हमने document.getElementById("p1") सेलेक्‍टर का प्रयोग किया है । इस सेलेक्‍टर के प्रयोग से हम किसी भी एलीमेण्‍ट को उसकी आईडी के द्वारा सेलेक्‍ट कर सकते हैं । ध्‍यान रहे इस सेलेक्‍टर के प्रयोग के लिये आपके एलीमेण्‍ट में आईडी डिफाइन होना अनिवार्य है ।

इसी तरह जावास्क्रिप्‍ट में विभिन्‍न एलीमेण्‍ट्स, टैग्‍स आदि को सेलेक्‍ट करने के लिये सेलेक्‍टर बनाये गये हैं । ये सेलेक्‍टर निम्‍नलिखित हैं ।

document.getElementById()
document.getElementsByClassName()
document.getElementsByName()
document.getElementsByTagName()
document.querySelector()
आइये इनमें से प्रत्‍येक का प्रयोग करके देखते हैं ।

जावास्क्रिप्‍ट एचटीएमएल आईडी सेलेक्‍टर ।। 
JavaScript HTML #id Selector 

जावास्क्रिप्‍ट के द्वारा एचटीएमएल एलीमेण्‍ट्स को उनकी आईडी से सेलेक्‍ट करने के लिये हम इस सेलेक्‍टर कोड का प्रयोग करते हैं ।
1- इसके लिये सबसे पहले हमें अपने टैग को एक आईडी देनी होती है ।
  उदाहरण - <div id="d1">Your Text Here</div>
2- अब हम आईडीसेलेक्‍टर स्क्रिप्‍ट से उस टैग की आईडी सेलेक्‍ट करते हैं जिसमें हमें परिवर्तन करना है ।
उदाहरण - <script> document.getElementById("d1"); </script>
3- एचटीएमएल आईडी को सेलेक्‍ट कर लेने के बाद हम उसमें वांछित परिवर्तन करने के लिये अपना वांछित कोड लिखते हैं ।

उदाहरण -
<script> document.getElementById("d1").innerHTML = "Your New Text Will Go Here"; </script>

अब इस पूरे कोड को एक करके देखते हैं -

<!doctype html>
<head>
<title>Learn Js</title>
</head>
<body>
<div id="d1">Your Text Here</div>

<script>
document.getElementById("d1").innerHTML = "Your New Text Will Go Here";
</script>

</body>
</html>

अब इसे होम.एचटीएमएल नाम से सुरक्षित करें और रन कराएँ । आपका Your Text Here वाक्‍य बदलकर Your New Text Will Go Here हो जाएगा ।

आगे के पाठों में हम सभी सेलेक्‍टर्स का प्रयोग करना सीखेंगे ।।

Contact us for Very Cheap Website Designing in Akbarpur, Website Designing in Ambedkar nagar, Website in Faizabad, Website in Barabanki, Website in Gonda, Website in Sultanpur, Website in Lucknow, Website in Azamgarh and other nearby Cities

Labels:

Comments

Post a Comment

Popular posts from this blog

एचटीएमएल संरचना ।

By
पिछले पाठ में हमने एचटीएमएल का एक प्रारूप देखा । यहाँ पर उस प्रारूप की व्‍याख्‍या की जायेगी । इस अध्‍याय को लिखते समय हम यह मानकर चल रहे हैं कि वेबडिजाइनिंग सीखने की इच्‍छा रखने वाले को सामान्‍य कम्‍प्‍यूटर ज्ञान जैसे कि कम्‍प्‍यूटर की कोई फाइल या फोल्‍डर खोलना, बन्‍द करना, किसी प्रोग्राम को खोलना, नया फोल्‍डर बनाना, किसी फाइल को खोलना, उसपर काम करना, उसे सेव करना तथा डिलीट करना आदि । इसलिये हम इन सभी बातों को बताने की अपेक्षा सीधे एचटीएमएल की तरफ चलते हैं । एचटीएमएल का फुलफार्म - HTML = Hyper Text Markup Language एचटीएमएल संरचना - पिछले पाठ में हमने निम्‍न कोडिंग का प्रयोग किया था । <!DOCTYPE HTML> <html> <head> <title>My First Html Page</title> </head> <body> Hello World </body> </html> अब इस कोडिंग की पूरी व्‍याख्‍या यहाँ प्रस्‍तुत की जा रही है ताकि आप एचटीएमएल को पूरी तरह समझ सकें । यह ध्‍यान रखें कि एचटीएमएल वेबपेज बनाने का सर्वप्रथम सोपान है, बिना इसके सीखे आप वेबपेज नही बना सकते हैं । <!DOCTYPE
7 comments
Read more

एचटीएमएल सीखें - हिन्‍दी में ।।

By
मित्रों       वेबसाइट डिजाइनिंग सीखने के शुरुआती दिनों में ज्‍यादा तकलीफ इसी लिये हुई कि कई सारी चीजें अंग्रेजी में समझ में आती ही नही थीं । फिर घर से दूर जाकर सीखने के लिये समय का अभाव भी था । इन्‍ही बातों को ध्‍यान में रखते हुए मेरे जैसे बाकी लोगों को ये समस्‍या न आने पाये, इसके लिये ही हिन्‍दी में में यह ट्यूटोरियल ब्‍लाग प्रारम्‍भ किया जा रहा है ।      इस ब्लाग पर सबसे पहले एचटीएमएल जो कि वेबसाइट बनाने के लिये सर्वप्रथम व अनिवार्य डिजाइनिंग भाषा है को सिखाया जायेगा । जिससे कि आप सभी कुछ सामान्‍य व आवश्‍यक चीजों को जान सकें । आवश्‍यकता -  एचटीएमएल सीखने के लिये प्राथमिक आवश्‍यकता मात्र एक कम्‍प्‍यूटर सिस्‍टम जिसमें कि एक इण्‍टरनेट ब्राउजर तथा एक टेक्‍स्‍ट एडिटर (उदा. नोटपैड) हो की है । यदि आपके पास विन्‍डोज सिस्‍टम है तो इसमें इण्‍टरनेट एक्‍सप्‍लोरर इण्‍टरनेट ब्राउजर   तथा नोटपैड पहले से ही होता है । अन्‍य इण्‍टरनेट ब्राउजर्स में मोजिला का फायरफॉक्‍स, गूगल क्रोम, सफारी आदि कई हैं । इनमें से जो भी चाहें प्रयोग कर सकते हैं । यदि फायरफाक्‍स का प्रयोग करें तो अधिक आसानी
5 comments
Read more

एचटीएमएल हेड सेक्‍सन (शीर्ष विभाग) ।।

By
     पिछले पाठ में हमने एचटीएमएल पृृष्‍ठ की सामान्‍य संरचना पढी । इस पाठ में हम वेब पेज के निर्माण में लगने वाली मूलभूत कोडिंग के विषय में जानेंगे ।      प्राय: सभी एचटीएमएल शिक्षक एक एक विषय को पकडकर एचटीएमएल कोडिंग सिखाते हैं जो निश्‍चय ही एक अत्‍यन्‍त महत्‍वपूर्ण व बेहतर तरीका है । किन्‍तु यह तरीका उन लोगों के लिये कम कारगर है जो कम समय में ज्‍यादा सीखना चाहते हैं । इसलिये यहाँ पर सिखाने का तरीका '' सरल से जटिल '' की आेर पर आधारित है  ।     आज के पाठ में हम एचटीएमएल के हेड सेक्‍सन में की जाने वाली महत्‍वपूर्ण कोडिंग सीखेंगे । एचटीएमएल हेड सेक्‍सन (शीर्ष विभाग) -      एचटीएमएल का हेड सेक्‍सन वह विभाग है जो हमें वेबपेज के रूप में तो नहीं दिखता है किन्‍तु वेबपेज के दिखने में जिसकी महत्‍वपूर्ण भूमिका रहती है  । इस सेक्‍सन के अन्‍तर्गत की गई कोडिंग्‍स आपके वेबपेज को स्‍टाइल करने के‍ लिये, वेब पेज में स्क्रिप्‍ट डालने के लिये,वेबसाइट की डिसक्रिप्‍शन तथा भाषा आदि बताने के लिये प्रयुक्‍त होती है । हेड सेक्‍सन के अन्‍तर्गत निम्‍न टैग प्रयुक्‍त किये जाते हैं  ।
Post a Comment
Read more