innerHTML 屬性用於獲取或替換 HTML 元素的內容，語法為Object.innerHTML
其中1.Object是獲取的元素對象，如通過document.getElementById("ID")獲取的元素；2.注意書寫，innerHTML區分大小寫。
我們通過id="light"獲取<div> 元素，並將元素的內容輸出和改變元素內容，代碼如下:
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="utf-8"> 5 <title>innerHTML屬性</title> 6 </head> 7 <body> 8 <div id="cshi"> 9 你好，黑夜20200317 10 </div> 11 <!-- <script type="text/javascript"> 12 var mylight=document.getElementById('light'); 13 document.write('原始內容:'+mylight.innerHTML+'<br/>');//輸入元素內容 14 mylight.innerHTML='javascript tomorrow';//修改元素內容 15 document.write('替換內容:'+mylight.innerHTML); 16 </script> --> 17 <script type="text/javascript"> 18 var mystr=document.getElementById('cshi'); 19 mystr.innerHTML="DOM操作"; 20 // document.write(mystr); 21 </script> 22 </body> 23 </html>
通過id獲取h2標簽元素,並賦給變量mychar,然后使用innerHTML屬性，將獲取的h2標簽內容修改為"Hello world!"
1 <!DOCTYPE HTML> 2 <html> 3 <head> 4 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 5 <title>innerHTML</title> 6 </head> 7 <body> 8 <h2 id="con">javascript</H2> 9 <p> JavaScript是一種基於對象、事件驅動的簡單腳本語言，嵌入在HTML文檔中，由瀏覽器負責解釋和執行，在網頁上產生動態的顯示效果並實現與用戶交互功能。</p> 10 <script type="text/javascript"> 11 var mychar= document.getElementById('icon'); ; 12 document.write("原標題:"+mychar.innerHTML+"<br>"); //輸出原h2標簽內容 13 mychar.innerHTML="Hello world!"; 14 document.write("修改后的標題:"+mychar.innerHTML); //輸出修改后h2標簽內容 15 </script> 16 </body> 17 </html>