--轉自http://blog.163.com/yw_0721/blog/static/7164579720102932157759/

簡單的說innerHTML和outerHTML、innerText與outerText的不同之處在于：?

1）、innerHTML與outerHTML在設置對象的內容時包含的HTML會被解析，而innerText與outerText則不會。?
2)、在設置時，innerHTML與innerText僅設置標簽內的文本，而outerHTML與outerText設置包括標簽在內的文本。?



特別說明：?
　　innerHTML是符合W3C標準的屬性，而innerText、outerText、outerHTML只適用于IE瀏覽器，因此，盡可能地去使用innerHTML，而少用innerText，如果要輸出不含HTML標簽的內容，可以使用innerHTML取得包含HTML標簽的內容后，再用正則表達式去除HTML標簽，下面是一個簡單的符合W3C標準的示例：?
<a href="javascript:alert(document.getElementById('test').innerHTML.replace(/<.+?>/gim,''))">無HTML,符合W3C標準</a>?

詳細出處參考：http://jhxk.javaeye.com/blog/353309

代碼練習：(ie生效，ff中只有innerHTML是對的)
<script type="text/javascript"> function getinnerHTML() { var e=window.document.getElementById("testdiv"); alert(e.innerHTML); //<p>白云</p> } function getouterHTML() { var e=window.document.getElementById("testdiv"); alert(e.outerHTML); //<div id="testdiv"><p>白云</p></div> } function getinnerText() { var e=window.document.getElementById("testdiv"); alert(e.innerText); //白云 } function getouterText() { var e=window.document.getElementById("testdiv"); alert(e.outerText); //白云 } </script> <div id="testdiv"><p>白云</p></div> <p> <input type="button" name="Submit2" value="innerHTML" onClick="getinnerHTML()"> <input type="button" name="Submit" value="outerHTML" onClick="getouterHTML()"> <input type="button" name="Submit2" value="innerHTML" onClick="getinnerText() "> <input type="button" name="Submit2" value="innerHTML" onClick="getouterText()"> </p>
? ? ??

轉載于:https://www.cnblogs.com/ghsau/archive/2012/07/18/2768532.html

《新程序員》：云原生和全面數字化實踐50位技術專家共同創作，文字、視頻、音頻交互閱讀

總結

以上是生活随笔為你收集整理的DOM中的outerHTML,innerHTML,outerText,innerText的区别的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。