首頁 > 開發者 > JavaScript
innerHTML是使用頻率非常高的一個JavaScript方法的，因為很多時候它可以代替複雜的DOM操作方法，它的作用就是向一個HTML容器插入帶HTLM標記的文本字元內容，並保留HTML呈現效果。本人一直以為這個方法不會有瀏覽器軟體相容問題（指在目前常見的瀏覽器中）。今天在調試一段JS代碼的時候，發現在IE下運行不正常，Firefox瀏覽器則沒有問題，通過逐步排查發現問題出在innerHTML方法上，我用try
{}catch(e){}語句在IE下捕獲一個“未知的執行階段錯誤”，錯誤提示很不明了，最後經本人多次嘗試測試發現是HTML嵌套問題。
先看看以下的標記寫法，以下嵌套顯然是不合法的。
<p id="box">通過Dreamweaver內建的“驗證”功能也確實發現這一問題的存在，錯誤提示如：
而本文要談的innerHTML異常就發生在你把含有大的標籤放入一個小的容器時（如把div放入span，形成<span><div>Content text</div></span>這種非法嵌套結構），或者是出現非約定的嵌套關係時。下面提供簡單代碼供你測試，你可以把以下代碼複製另存新檔Test.html檔案，然後分別在IE與FF瀏覽器運行它，你會發現它在IE下會報錯（目前本人測試IE版本為IE7，不知道其它版本有沒有這一問題）。真是感覺有時候IE還比FF標準，汗。
測試代碼：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><body>
<p id="box"><li>Content text</li></p>
<script type="text/javascript">
try
{
document.getElementById('box').innerHTML='<li>向P標籤中插入含LI標籤HTML內容</li>'; //IE下出現“未知的執行階段錯誤”，FF瀏覽器正常
//document.getElementById('box').innerHTML='<span>向P標籤中插入含SPAN標籤HTML內容</span>'; //IE與FF都正常
}
catch(e)
{
alert(e.message);
}
</script>
</body>
</html>
相關內容：innerHTML方法會預先檢查並修複包含HTML字串標記的DOM完整度，請看下面舉例：
<div id="box"></div>Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
