HTML DOM Element innerHTML गुण

वर्णन और उपयोग

innerHTML सामग्री गुण नियत करे या वापस करे एलिमेंट के HTML सामग्री (आंतरिक HTML)।

दूसरे संदर्भ

innerText गुण

textContent गुण

उदाहरण

उदाहरण 1

id="myP" एलिमेंट के HTML सामग्री को प्राप्त करें:

let html = document.getElementById("myP").innerHTML;

खुद आज़माएं

उदाहरण 2

id="demo" एलिमेंट के HTML सामग्री को बदलें:

document.getElementById("demo").innerHTML = "I have changed!";

खुद आज़माएं

उदाहरण 3

id="myList" के <ul> एलिमेंट के HTML सामग्री को प्राप्त करें:

let html = document.getElementById("myList").innerHTML;

खुद आज़माएं

उदाहरण 4

id="demo" के <p> एलिमेंट के HTML सामग्री को मिटाएं:

element.innerHTML = "";

खुद आज़माएं

उदाहरण 5

दो एलिमेंट के HTML सामग्री को बदलें:

let text = "Hello Dolly.";
document.getElementById("myP").innerHTML = text;
document.getElementById("myDIV").innerHTML = text;

खुद आज़माएं

उदाहरण 6

एलिमेंट के HTML सामग्री को दोहराएं:

element.innerHTML += element.innerHTML;

खुद आज़माएं

उदाहरण 7

लिंक के HTML सामग्री और URL को बदलें:

element.innerHTML = "W3School";
element.href = "";

खुद आज़माएं

व्याकरण

innerHTML एट्रिब्यूट वापस करना:

एलिमेंट.innerHTML

innerHTML एट्रिब्यूट सेट करना:

एलिमेंट.innerHTML = text

प्रकृति मूल्य

मूल्य वर्णन
शब्दकार HTML सामग्री

वापसी मूल्य

टाइप वर्णन
शब्दकार एलिमेंट का HTML सामग्री

innerHTML, innerText और textContent के अंतर

innerText एट्रिब्यूट वापस:

केवल एलिमेंट और उसके सभी उपलब्ध पीढ़ियों के टेक्स्ट सामग्री को वापस करता है, CSS छुपे हुए टेक्स्ट सहित, जिसमें जावास्क्रिप्ट और <style> एलिमेंट शामिल नहीं हैं।

innerHTML एट्रिब्यूट वापस:

एलिमेंट के टेक्स्ट सामग्री, सभी खाली जगह और आंतरिक HTML टैग सहित।

textContent एट्रिब्यूट वापस:

एलिमेंट और सभी उपलब्ध पीढ़ियों के टेक्स्ट सामग्री, खाली जगह और CSS छुपे हुए टेक्स्ट सहित, लेकिन टैग नहीं है।

HTML उदाहरण

<p id="myP">   This element has extra spacing     and contains <span>a span element</span>.</p>

JavaScript इन्स्टैंस

let text = document.getElementById("myP").innerText;
let text = document.getElementById("myP").innerHTML;
let text = document.getElementById("demo").textContent;

खुद आज़माएं

उपरोक्त उदाहरण में:

innerText एट्रिब्यूट वापस:

यह एलिमेंट अतिरिक्त स्पेसिंग है और एक स्पैन एलिमेंट शामिल करता है。

innerHTML एट्रिब्यूट वापस:

   यह एलिमेंट अतिरिक्त स्पेसिंग है और <span>एक स्पैन एलिमेंट</span> शामिल करता है。

textContent एट्रिब्यूट वापस:

   यह एलिमेंट अतिरिक्त स्पेसिंग है और एक <span>स्पैन एलिमेंट</span> शामिल करता है。

ब्राउज़र समर्थन करते हैं

सभी ब्राउज़र समर्थन करते हैं element.innerHTMLदूरी निर्धारण

च्रोम आईई एज फायरफॉक्स सफारी ओपेरा
च्रोम आईई एज फायरफॉक्स सफारी ओपेरा
समर्थन समर्थन समर्थन समर्थन समर्थन समर्थन