關於通過innerHTML插入樣式的問題

在js代碼中,通過innerHTML加入一段頁面,代碼如下:

運行後,發現在ie下,頁面style中的樣式沒有被解析,頁面展現不對,而在ff下展現正常。 請教瞭高手,再閱讀 http://www.gold98.net/article.asp?id=897,發現原來在使用innerHTML或insertAdjacentHTML的時候,如果插入的html代碼的開頭有noscope元素(包括script,style,註釋)的時候,ie會自動將開頭的noscope元素去掉。 如果要解決這個問題,可以有兩種方法:

1) 內容前面加一個scope的元素(如p,如下)

註:display為none的設置基本上可以被所有瀏覽器識別,參見 http://www.w3help.org/zh-cn/causes/RM8001,但ie6以下的ie沒有深究

2) 將css提出來再添加到樣式表裡

接下來,我們試一試下面的代碼

 發現同樣在ie下,這裡展現也不對,頁面中的style也沒有生效,比較奇怪的是這裡是以開頭,而非noscope元素,於是對代碼進行瞭以下修改

這樣是可以正常展現的,如此看來,這裡ie在識別開頭元素的時候,並不是表面的寫在前面的標簽,而是解析後的第一個完整的元素。

參考資料:

/kf/201202/118248.html

http://www.w3help.org/zh-cn/causes/RM8001

摘自 編碼者說

發佈留言

發佈留言必須填寫的電子郵件地址不會公開。