एचटीएमएल डोम टेक्स्ट सामग्री संपत्ति
उदाहरण
किसी तत्व की टेक्स्ट सामग्री प्राप्त करें:
var x =
document.getElementById("myBtn").textContent;
नीचे और अधिक "इसे स्वयं आज़माएं" उदाहरण।
परिभाषा और उपयोग
TextContent प्रॉपर्टी निर्दिष्ट नोड और उसके सभी वंशजों की टेक्स्ट सामग्री को सेट या लौटाती है ।
यदि आप टेक्स्ट सामग्री गुण सेट करते हैं, तो किसी भी बच्चे के नोड्स को हटा दिया जाता है और निर्दिष्ट स्ट्रिंग वाले एकल टेक्स्ट नोड द्वारा प्रतिस्थापित किया जाता है।
नोट: यह संपत्ति आंतरिक पाठ संपत्ति के समान है, हालांकि कुछ अंतर हैं:
- textContent सभी तत्वों की टेक्स्ट सामग्री देता है, जबकि innerText <script> और <style> तत्वों को छोड़कर , सभी तत्वों की सामग्री देता है।
- innerText उन तत्वों का पाठ नहीं लौटाएगा जो CSS (textContent will) के साथ छिपे हुए हैं।
युक्ति: कभी-कभी इस संपत्ति का उपयोग नोडवैल्यू संपत्ति के बजाय किया जा सकता है, लेकिन याद रखें कि यह संपत्ति सभी बच्चे नोड्स का पाठ भी लौटाती है।
युक्ति: किसी तत्व की HTML सामग्री को सेट करने या वापस करने के लिए, आंतरिक HTML गुण का उपयोग करें ।
ब्राउज़र समर्थन
तालिका में संख्याएं पहले ब्राउज़र संस्करण को निर्दिष्ट करती हैं जो पूरी तरह से संपत्ति का समर्थन करता है।
Property | |||||
---|---|---|---|---|---|
textContent | 1.0 | 9.0 | Yes | Yes | Yes |
वाक्य - विन्यास
नोड की टेक्स्ट सामग्री लौटाएं:
node.textContent
नोड की टेक्स्ट सामग्री सेट करें:
node.textContent = text
सम्पत्ति की कीमत
Value | Type | Description |
---|---|---|
text | String | Specifies the text content of the specified node |
टेक्निकल डिटेल
प्रतिलाभ की मात्रा: | एक स्ट्रिंग, जो नोड और उसके सभी वंशजों के पाठ का प्रतिनिधित्व करती है। यदि तत्व एक दस्तावेज़, एक दस्तावेज़ प्रकार, या एक संकेतन है, तो अशक्त लौटाता है। |
---|---|
डोम संस्करण | कोर स्तर 3 नोड वस्तु |
और ज्यादा उदाहरण
उदाहरण
आईडी = "डेमो" के साथ <p> तत्व की पाठ्य सामग्री बदलें:
document.getElementById("demo").textContent = "Paragraph changed!";
उदाहरण
आईडी = "myList" के साथ <ul> तत्व की सभी पाठ्य सामग्री प्राप्त करें:
var x = document.getElementById("myList").textContent;
x का मान होगा:
Coffee Tea
उदाहरण
यह उदाहरण आंतरिक पाठ, आंतरिक HTML और पाठ सामग्री के बीच कुछ अंतरों को प्रदर्शित करता है:
<p id="demo"> This element has extra spacing and contains <span>a span
element</span>.</p>
<script>
function getInnerText() {
alert(document.getElementById("demo").innerText)
}
function getHTML()
{
alert(document.getElementById("demo").innerHTML)
}
function
getTextContent() {
alert(document.getElementById("demo").textContent)
}
</script>
निर्दिष्ट गुणों के साथ उपरोक्त <p> तत्व की सामग्री प्राप्त करें:
innerText रिटर्न: "इस तत्व में अतिरिक्त रिक्ति है और इसमें एक अवधि तत्व है।"
आंतरिक HTML रिटर्न: "इस तत्व में अतिरिक्त रिक्ति है और इसमें <span>एक अवधि तत्व</span> है।"
textContent रिटर्न: "इस तत्व में अतिरिक्त रिक्ति है और इसमें एक स्पैन तत्व है।"
इनरटेक्स्ट प्रॉपर्टी बिना स्पेसिंग और इनर एलिमेंट टैग के सिर्फ टेक्स्ट लौटाती है।
आंतरिक HTML गुण पाठ को लौटाता है, जिसमें सभी रिक्ति और आंतरिक तत्व टैग शामिल हैं।
टेक्स्ट सामग्री गुण टेक्स्ट को रिक्ति के साथ लौटाता है, लेकिन आंतरिक तत्व टैग के बिना।