सभी आपको जावास्क्रिप्ट में इनर HTML के बारे में जानना होगा

जावास्क्रिप्ट सबसे अधिक उपयोग की जाने वाली प्रोग्रामिंग भाषाओं में से एक है। यह प्लेटफार्मों भर में अपनी बहुमुखी प्रतिभा के लिए काफी लोकप्रिय है। में अलग-अलग गुण हैं जो डायनामिक वेबसाइट बनाने के आपके काम को आसान बनाता है। इस लेख में, हम निम्नलिखित क्रम में जावास्क्रिप्ट में इनर HTML पर चर्चा करेंगे:

• जावास्क्रिप्ट का परिचय
• जावास्क्रिप्ट में इनर HTML
  • आदेशित या अव्यवस्थित सूची
  • URL बदलना

जावास्क्रिप्ट का परिचय

जावास्क्रिप्ट का उपयोग क्लाइंट-साइड प्रोग्रामिंग भाषा के साथ-साथ सर्वर-साइड प्रोग्रामिंग भाषा के रूप में किया जाता है। निष्पादित करने के लिए उपयोग किया जाता है क्लाइंट-साइड के साथ-साथ किसी भी एप्लिकेशन के सर्वर-साइड पर। कई स्थानों पर नोड को Node.js के रूप में भी संदर्भित किया जा सकता है।

जावा में वर्ग बनाम इंटरफ़ेस

जावास्क्रिप्ट आसानी के साथ प्रदर्शन करने के लिए कई कार्यक्षमताओं के लिए कई तरीके प्रदान करता है। यह वही है जिसने जावास्क्रिप्ट को सबसे लोकप्रिय प्रोग्रामिंग भाषाओं में से एक बनाया है और साथ ही साथ इसे कई प्रकार के उत्पाद विकास में भी व्यापक रूप से उपयोग किया जा रहा है।

जावास्क्रिप्ट में इनर HTML

भीतरी जावास्क्रिप्ट में संपत्ति एक बहुत ही उपयोगी सुविधाओं में से एक है और व्यापक रूप से वेब पेज बनाने के लिए एक अधिक गतिशील और बहुमुखी पहलू प्रदान करने के लिए उपयोग किया जाता है।

अगर हम आंतरिक HTML को सरलता से समझाने की कोशिश करते हैं तो भीतरी HTML द्वारा किया गया कार्य केवल पृष्ठ की सामग्री को पूरे पृष्ठ को ताज़ा किए बिना लोड करना है। यह पेज लोड के पीछे के समय के साथ-साथ डेटा के उपयोग को बचाता है और हासिल करने के लिए बहुत आसान है। यह उपयोगकर्ता को बहुत तेज और प्रतिक्रियाशील अनुभव देता है जिससे उपयोगकर्ता अनुभव को बेहतर बना देता है।

यह थोड़ा मुश्किल लग सकता है लेकिन इसे एक उदाहरण की मदद से समझने की कोशिश करते हैं।

उदाहरण:

 
इनर HTML टेक्स्ट को बदलने के लिए यहां क्लिक करें।
फंक्शन myFunction () {document.getElementById ('पैराग्राफ 1')। भीतरी HTML = 'पैराग्राफ बदल गया!' }

यहाँ उपर्युक्त कोड में, पैराग्राफ टैग में उसी की आईडी है जो paragraph 1 है।

वहां एक है समारोह myfunction () जिसका नाम पाठ पर क्लिक करने पर रद्द किया जाएगा 'आंतरिक HTML पाठ बदलने के लिए यहां क्लिक करें'।जब फ़ंक्शन को क्लिक पर निरस्त कर दिया जाता है, तो फ़ंक्शन निष्पादित हो जाता है जो getElementById ('पैराग्राफ 1') कहता है, जिसमें ईएम के साथ तत्व को डेमो के रूप में चुना जाना है।

इसके अलावा, हमारे पास इनरएचटीएमएल फंक्शन है जिसका मतलब है कि ओनलीक के बाद क्या करना है। यहाँ उपर्युक्त उदाहरण में, यह 'पैराग्राफ बदला हुआ' है।

नीचे उपरोक्त कोड का प्रारंभिक आउटपुट है।

नीचे क्लिक के बाद परिवर्तित आउटपुट है।

आंतरिक HTML आदेशित या अव्यवस्थित सूची के साथ

नीचे दिए गए या अनियोजित सूची के साथ आंतरिक HTML का उपयोग दिखाने के लिए एक उदाहरण है।

उदाहरण:

 
 
नमस्कार
 
फिर से हैलो
 
 
उल तत्व की सामग्री प्राप्त करने के लिए नीचे दिए गए बटन पर क्लिक करें।
इसे हल करने का प्रयास करें हेलोफंक्शन () {var x = document.getElementById ('myList')। भीतर HTML document.getElementById ('पैराग्राफ 1')। भीतर HTML = x}

यहां आंतरिक HTML 'कोशिश करो' नाम से परिभाषित बटन द्वारा ट्रिगर हो जाता है।

उपरोक्त पाठ का प्रारंभिक आउटपुट है:

बटन पर क्लिक करने के बाद आउटपुट। बटन पर क्लिक करने से पृष्ठ को फिर से लोड नहीं किया जा सकता है, बल्कि इसके बजाय इनर HTML के उपयोग के कारण होता है।

URL बदलने के लिए इनर

नीचे एक और उदाहरण है जो बटन क्लिक पर URL बदलने के लिए इनर HTML का उपयोग दिखाता है।

उदाहरण:

  विकिपीडिया लिंक बदलें फंक्शन myFunction () {document.getElementById ('myAnchor') - भीतर HTML = 'Google' document.getElementById ('myAnchor')। Href = 'www.google.com 'document.getElementById (' myAnchor ') ) .टार्गेट = '_ब्लांक'}

उपरोक्त उदाहरण शुरू में विकिपीडिया वेबसाइट का लिंक देता है लेकिन जब बटन पर क्लिक किया जाता है तो गूगल में लिंक बदल जाता है।

कई ऐसे ऑपरेशन हैं जहां पेज को दोबारा लोड नहीं करना है और केवल एक हिस्सा अपडेट किया जाना है।यह समय बचाता है, साथ ही कम प्रयास, दृष्टिकोण के लिए किए जाने हैं।इनरएचटीएमएल का सबसे बड़ा लाभ उपयोगकर्ता अनुभव है जो इस सुविधा के साथ बढ़ाया जाता है।

इसकी जाँच पड़ताल करो Edureka द्वारा। वेब डेवलपमेंट सर्टिफिकेशन ट्रेनिंग आपको HTML5, CSS3, Twitter बूटस्ट्रैप 3, jQuery और Google API का उपयोग करके प्रभावशाली वेबसाइट बनाने और इसे अमेज़ॅन सिंपल स्टोरेज सर्विस (S3) में तैनात करने में मदद करेगी।

क्या आप हमसे कोई प्रश्न पूछना चाहते हैं? कृपया इसे 'जावास्क्रिप्ट में स्ट्रिंग कांसेप्टेशन' की टिप्पणी अनुभाग में उल्लेख करें और हम आपको वापस मिलेंगे।

एसक्यूएल सर्वर एकीकरण सेवाओं ट्यूटोरियल