HTML DOM Element innerHTML అత్యావసరం

నిర్వచనం మరియు ఉపయోగం

innerHTML అంశం సెట్టింగ్ లేదా పొందండి యొక్క ఎలమెంట్న హెచ్ఎంఎల్ కంటెంట్ (అంతర్గత హెచ్ఎంఎల్).

మరింత విచారణ కోసం చూడండి:

innerText అత్యావసరం

textContent అత్యావసరం

ఉదాహరణ

ఉదాహరణ 1

id="myP" యొక్క ఎలమెంట్న హెచ్ఎంఎల్ కంటెంట్ను పొందండి:

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

స్వయంగా ప్రయత్నించండి

ఉదాహరణ 2

id="demo" యొక్క ఎలమెంట్న హెచ్ఎంఎల్ కంటెంట్ను మార్చండి:

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

స్వయంగా ప్రయత్నించండి

ఉదాహరణ 3

id="myList" యొక్క <ul> ఎలమెంట్న హెచ్ఎంఎల్ కంటెంట్ను పొందండి:

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

స్వయంగా ప్రయత్నించండి

ఉదాహరణ 4

id="demo" యొక్క <p> ఎలమెంట్న హెచ్ఎంఎల్ కంటెంట్ను తొలగించండి:

element.innerHTML = "";

స్వయంగా ప్రయత్నించండి

ఉదాహరణ 5

రెండు ఎలమెంట్ల హెచ్ఎంఎల్ కంటెంట్ను మార్చండి:

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 = "";

స్వయంగా ప్రయత్నించండి

సింథాక్స్

అందిస్తుంది ఇన్నర్ హెచ్చిల్ అంశం:

element.innerHTML

సెట్ ఇన్నర్ హెచ్చిల్ అంశం:

element.innerHTML = text

అంశం విలువ

విలువ వివరణ
స్ట్రింగ్. HTML పరిణామం

పునఃవచ్చింది

రకం వివరణ
స్ట్రింగ్ అంశం యొక్క HTML పరిణామం

innerHTML, innerText మరియు textContent మధ్య తేడా

innerText అంశం అందిస్తుంది:

అంశం మరియు అంతర్గత అంశం పరిణామాలను పొందిస్తుంది, కానీ CSS మచ్చబట్టలు మరియు టాగులు లేవు, కానీ <script> మరియు <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 అంశం అందిస్తుంది:

This element has extra spacing and contains a span element.

innerHTML అంశం అందిస్తుంది:

   This element has extra spacing    and contains <span>a span element</span>.

textContent అంశం అందిస్తుంది:

   This element has extra spacing    and contains a span element.

బ్రౌజర్ మద్దతు

అన్ని బ్రౌజర్లు మద్దతు ఇస్తాయి element.innerHTML：

Chrome IE Edge Firefox Safari Opera
Chrome IE Edge Firefox Safari Opera
支持 支持 支持 支持 支持 支持