आप जैसे पाठक MUO का समर्थन करने में मदद करते हैं। जब आप हमारी साइट पर लिंक का उपयोग करके खरीदारी करते हैं, तो हम संबद्ध कमीशन अर्जित कर सकते हैं। और पढ़ें।

आंतरिक HTML और बाहरी HTML DOM गुण आपको वेबपृष्ठ पर सामग्री पढ़ने और लिखने की अनुमति देते हैं। आप उनका उपयोग मार्कअप लाने या उसमें परिवर्तन करने के लिए कर सकते हैं, और दोनों कई मायनों में समान हैं। लेकिन एक महत्वपूर्ण अंतर है।

DOM के साथ काम करते समय, आप इनर HTML और आउटर HTML का काफी अलग तरह से उपयोग करेंगे। व्यावहारिक उदाहरणों के साथ इन दो गुणों का उपयोग कैसे करें, इसका पता लगाएं।

आंतरिक एचटीएमएल क्या है?

innerHTML गुण का हिस्सा है डोम और आप इसे जावास्क्रिप्ट के माध्यम से एक्सेस कर सकते हैं। आप किसी तत्व की सामग्री प्राप्त करने या सेट करने के लिए इसका उपयोग कर सकते हैं। इस सामग्री में तत्व का अपना टैग शामिल नहीं है और केवल उस मार्कअप को शामिल करता है जो स्ट्रिंग के रूप में तत्व के चिल्ड्रन का प्रतिनिधित्व करता है।

इस कोड नमूने पर विचार करें:

<एचटीएमएल>
<शरीर>
<पीपहचान="मेरे पी">मैं एक पैराग्राफ हूँ।पी>


<लिखी हुई कहानी>
दस्तावेज़.getElementById("मेरे पी".आंतरिक HTML = "हैलो वर्ल्ड";
लिखी हुई कहानी>
शरीर>


एचटीएमएल>
instagram viewer

अपने ब्राउज़र में, आप प्रतिस्थापन पाठ के साथ एक मानक अनुच्छेद देखेंगे, जैसे:

innerHTML गुण की सामग्री का चयन और परिवर्तन करता हैइस उदाहरण में तत्व।

बाहरी HTML क्या है?

बाहरी HTML संपत्ति कई मायनों में आंतरिक HTML की तरह है। आप किसी चयनित तत्व की सामग्री प्राप्त करने या सेट करने के लिए इसका उपयोग कर सकते हैं। हालाँकि, यह तत्व का प्रतिनिधित्व करने वाले मार्कअप को भी सेट करता है। इसमें ओपनिंग टैग, कोई भी प्रॉपर्टी, और—जहाँ प्रासंगिक हो—क्लोज़िंग टैग शामिल है।

यह देखने के लिए पिछले उदाहरण पर दोबारा गौर करें कि आउटरएचटीएमएल कैसे अलग है:

<एचटीएमएल>
<शरीर>
<पीपहचान="मेरे पी">मैं एक पैराग्राफ हूँ।पी>


<लिखी हुई कहानी>
दस्तावेज़.getElementById("मेरे पी".आउटरएचटीएमएल = "
इस H1 ने एक पैराग्राफ को बदल दिया।
"
लिखी हुई कहानी>
शरीर>
एचटीएमएल>

अपने ब्राउज़र में, आपको ऐसा कुछ देखना चाहिए:

इस उदाहरण में, बाहरी HTML गुण परिवर्तन करता है पी तत्व में एक एच 1 तत्व।

अंतर जानें और इन गुणों का उपयोग कब करें

आंतरिक HTML और बाहरी HTML DOM गुणों में कई समानताएँ हैं, लेकिन एक महत्वपूर्ण अंतर है। innerHTML गुण किसी तत्व की HTML सामग्री को कैप्चर करता है। इसके विपरीत, बाहरी HTML गुण HTML को कैप्चर करता है जो स्वयं तत्व और उसकी सामग्री का प्रतिनिधित्व करता है।

आप इन गुणों का उपयोग DOM के माध्यम से HTML सामग्री को पढ़ने और लिखने के लिए कर सकते हैं। आपकी जावास्क्रिप्ट विकास प्रक्रिया के दौरान DOM एक सामान्य, महत्वपूर्ण अवधारणा होगी।