2011-02-02 13 views

उत्तर

12

The innerHTML property मिलता है या एक तत्व नोड के एचटीएमएल सामग्री सेट करने के लिए प्रयोग किया जाता है।

उदाहरण:http://jsfiddle.net/mQMVc/

 // get the element with the "someElement" id, and give it new content 
document.getElementById('someElement').innerHTML = "<p>new content</p>"; 

    // retrieve the content from an element 
var content = document.getElementById('someElement').innerHTML; 

alert(content); 
+0

और यह एक संपत्ति किसी भी मानक लेकिन समर्थित में उल्लेख नहीं किया है सभी प्रमुख ब्राउज़रों द्वारा। –

+0

@ फ़ेलिक्स: हालांकि यह [HTML5] का हिस्सा है (http://www.w3.org/TR/html5/apis-in-html-documents.html#innerhtml)। – user113716

+0

ओह ठीक है, मुझे यह नहीं पता था :) –

0

यह एक दिया एचटीएमएल टैग की पाठ्य सामग्री का प्रतिनिधित्व करता है। इसमें स्वयं के टैग भी शामिल हो सकते हैं।

2

आप किसी चयनित टैग की सामग्री एकत्र या सेट कर सकते हैं।

एक छद्म विचार, एक कमरे के भीतर कई बक्से होने और विचार 'भीतर सब कुछ है कि बॉक्स'

4

innerHTML संपत्ति दस्तावेज़ ऑब्जेक्ट मॉडल (डोम) का हिस्सा है कि जावास्क्रिप्ट की अनुमति देता है मतलब है अपने समान रूप प्रदर्शित होने वाली वेबसाइट में हेरफेर करने के लिए कोड। विशेष रूप से, यह किसी दिए गए DOM तत्व (HTML टैग) के भीतर सबकुछ पढ़ने और बदलने की अनुमति देता है।

हालांकि, innerHTML का उपयोग कर डोम जोड़तोड़ व्यक्ति डोम वस्तुओं के आधार पर जोड़तोड़ की तुलना में धीमी और अधिक विफलता-प्रवण हैं।

0

प्रत्येक HTML तत्व में innerHTML संपत्ति है जो HTML कोड और उस तत्व के उद्घाटन और समापन टैग के बीच होने वाले पाठ को परिभाषित करती है। कुछ उपयोगकर्ता इंटरैक्शन के बाद तत्व के innerHTML को बदलकर, आप अधिक इंटरैक्टिव पेज बना सकते हैं।

हालांकि, innerHTML का उपयोग करके कुछ तैयारी की आवश्यकता होती है यदि आप इसे आसानी से और विश्वसनीय रूप से उपयोग करने में सक्षम होना चाहते हैं। सबसे पहले, आपको वह तत्व देना होगा जिसे आप आईडी बदलना चाहते हैं। उस आईडी के साथ आप getElementById फ़ंक्शन का उपयोग करने में सक्षम होंगे, जो सभी ब्राउज़रों पर काम करता है।

आपके द्वारा सेट अप करने के बाद अब आप किसी तत्व के टेक्स्ट में हेरफेर कर सकते हैं। शुरू करने के लिए, आइए बोल्ड टैग के अंदर टेक्स्ट को बदलने का प्रयास करें। JavaScript कोड:

<script type="text/javascript"> 
function changeText(){ 
    document.getElementById('boldStuff').innerHTML = 'Fred Flinstone'; 
} 
</script> 
<p>Welcome to the site <b id='boldStuff'>dude</b> </p> 
<input type='button' onclick='changeText()' value='Change Text'/> 

इस उत्तर से here

2

प्रत्येक HTML तत्व एक innerHTML संपत्ति है कि दोनों एचटीएमएल कोड और पाठ कि उस तत्व के उद्घाटन और समापन टैग के बीच होता है परिभाषित करता है। कुछ उपयोगकर्ता इंटरैक्शन के बाद तत्व के आंतरिक HTML को बदलकर, आप अधिक इंटरैक्टिव पेज बना सकते हैं।

हालांकि, आंतरिक HTML का उपयोग करके कुछ तैयारी की आवश्यकता होती है यदि आप इसे आसानी से और विश्वसनीय रूप से उपयोग करने में सक्षम होना चाहते हैं। सबसे पहले, आपको वह तत्व देना होगा जिसे आप आईडी बदलना चाहते हैं। उस आईडी के साथ आप getElementById फ़ंक्शन का उपयोग करने में सक्षम होंगे, जो सभी ब्राउज़रों पर काम करता है।

1

आंतरिक HTML आईडी/नाम के आधार पर सामग्री प्राप्त करता है और उन्हें बदल देता है।

<!DOCTYPE html> 
 
<html> 
 
<head> 
 
\t <title>Learn JavaScript</title> 
 
</head> 
 
<body> 
 
<button type = "button" 
 
onclick="document.getElementById('demo').innerHTML = Date()"> <!--fetches the content with id demo and changes the innerHTML content to Date()--> 
 
Click for date 
 
</button> 
 
<h3 id = 'demo'>Before Button is clicked this content will be Displayed the inner content of h3 tag with id demo and once you click the button this will be replaced by the Date() ,which prints the current date and time </h3> 
 

 
</body> 
 
</html>

जब आप बटन क्लिक करें, h3 में सामग्री से innerHTML assignent यानी तिथि बदल दिया जाएगा()।

0

आंतरिक HTML प्रत्येक तत्व की एक संपत्ति है। यह आपको बताता है कि तत्व के प्रारंभिक और समापन टैग के बीच क्या है, और यह आपको तत्व की सामग्री सेट करने देता है।


संपत्ति एक वस्तु का एक पहलू का वर्णन है। यह किसी ऑब्जेक्ट के विपरीत किसी ऑब्जेक्ट के विपरीत होता है।


<p id="myParagraph"> 
This is my paragraph. 
</p> 

आप पैराग्राफ का चयन कर सकते हैं और फिर मान बदलने की यह निम्न आदेश के साथ innerHTML है:

document.getElementById("myParagraph").innerHTML = "This is my paragraph"; 
संबंधित मुद्दे