1、功能講解:innerHTML 設(shè)置或獲取位于對象起始和結(jié)束標簽內(nèi)的 HTMLouterHTML 設(shè)置或獲取對象及其內(nèi)容的 HTML 形式innerText 設(shè)置或獲取位于對象起始和結(jié)束標簽內(nèi)的文本outerText 設(shè)置(包括標簽)或獲取(不包括標簽)對象的文本代碼如下
<font size="3"><html> <head> <title>Demo</title> <style><!-- body {font-family:"宋體";color="blue";font-size="9pt"} --> </style> <script language="javaScript"> //.innerHTML function innerHTMLDemo() { alert(test_id1.innerHTML); test_id1.innerHTML="<i><u>設(shè)置或獲取位于對象起始和結(jié)束標簽內(nèi)的 HTML.</u></i>"; } //.innerText function innerTextDemo() { alert(test_id2.innerText); test_id2.innerText="<i><u>設(shè)置或獲取位于對象起始和結(jié)束標簽內(nèi)的文本.</u></i>"; } //.outerHTML function outerHTMLDemo() { alert(test_id3.outerHTML);<span class="Apple-style-span" style="background-color: #ffffff;">//設(shè)置完之后事件也被覆蓋了</span> test_id3.outerHTML="<i><u>設(shè)置或獲取對象及其內(nèi)容的 HTML 形式.</u></i>"; } //.outerText function outerTextDemo() { alert(test_id4.outerText);//設(shè)置完之后事件也被覆蓋了 test_id4.outerText="<i><u>設(shè)置(包括標簽)或獲取(不包括標簽)對象的文本.</u></i>"; } </script> </head> <body> <ul> <li id="test_id1" onclick="innerHTMLDemo()">innerHTML效果.</li> <li id="test_id2" onclick="innerTextDemo()">innerText效果.</li> <li id="test_id3" onclick="outerHTMLDemo()">outerHTML效果.</li> <li id="test_id4" onclick="outerTextDemo()">outerText效果.</li> </ul> </body> </html> </font>3、不同之處:簡單的說innerHTML和outerHTML、innerText與outerText的不同之處在于：1）、innerHTML與outerHTML在設(shè)置對象的內(nèi)容時包含的HTML會被解析，而innerText與outerText則不會。2)、在設(shè)置時，innerHTML與innerText僅設(shè)置標簽內(nèi)的文本，而outerHTML與outerText設(shè)置包括標簽在內(nèi)的文本。<ignore_js_op>
特別說明： innerHTML是符合W3C標準的屬性，而innerText只適用于IE瀏覽器，因此，盡可能地去使用innerHTML，而少用innerText，如果要輸出不含HTML標簽的內(nèi)容，可以使用innerHTML取得包含HTML標簽的內(nèi)容后，再用正則表達式去除HTML標簽，下面是一個簡單的符合W3C標準的示例：<a href="Javascript:alert(document.getElementById('test').innerHTML.replace(/<.+?>/gim,''))">無HTML,符合W3C標準</a>詳細說明：http://java.662p.com/thread-3222-1-1.html新聞熱點
疑難解答
