JQuery的html(data)方法與<script>腳本塊的解決方法
更新時間：2010年03月09日 21:23:59 作者：
在使用Jquery的html(data)方法執(zhí)行寫數(shù)據(jù)到Dom元素時遇到一個問題：在data參數(shù)中包含script腳本塊的時候，html(data)方法的執(zhí)行結(jié)果與預(yù)期不符
“今天才注意到j(luò)Query(...).html()方法返回的HTML會過濾掉所有的<script>塊，但有時候，特別是在AJAX應(yīng)用中，常常是需要保留HTML中的<script>塊的,比如局部更新含腳本的內(nèi)容，此時切忌不要用html()來讀寫HTML，還是要老老實(shí)實(shí)用elem.innerHTML。今天因?yàn)檫@個問題浪費(fèi)了1個小時，特此給大家提個醒?！?
經(jīng)過測試發(fā)現(xiàn)，新版本（1.3.2之后的，之前版本未考證過）的jQuery(...).html()方法已經(jīng)不存在該問題（html()方法是一個讀Dom元素數(shù)據(jù)的操作），但是當(dāng)用html(data)方法寫數(shù)據(jù)到Dom元素并且data參數(shù)中包含script腳本時，又出現(xiàn)了異?，F(xiàn)象：在Firefox（我用的3.6）瀏覽器下執(zhí)行上述操作，data參數(shù)里面的script腳本會自動運(yùn)行，引起頁面破相、異常等錯誤，比如我遇到的問題就是：在script中存在document.write方法時，在執(zhí)行完html(data)操作后整個頁面的原有的dom元素都消失了，只剩下document.write()方法的執(zhí)行結(jié)果，引起了頁面破相；具體原因待討論，最后還是用elem.innerHTML=data這種方式解決了這個問題，特此標(biāo)記。
經(jīng)過測試發(fā)現(xiàn)，新版本（1.3.2之后的，之前版本未考證過）的jQuery(...).html()方法已經(jīng)不存在該問題（html()方法是一個讀Dom元素數(shù)據(jù)的操作），但是當(dāng)用html(data)方法寫數(shù)據(jù)到Dom元素并且data參數(shù)中包含script腳本時，又出現(xiàn)了異?，F(xiàn)象：在Firefox（我用的3.6）瀏覽器下執(zhí)行上述操作，data參數(shù)里面的script腳本會自動運(yùn)行，引起頁面破相、異常等錯誤，比如我遇到的問題就是：在script中存在document.write方法時，在執(zhí)行完html(data)操作后整個頁面的原有的dom元素都消失了，只剩下document.write()方法的執(zhí)行結(jié)果，引起了頁面破相；具體原因待討論，最后還是用elem.innerHTML=data這種方式解決了這個問題，特此標(biāo)記。
您可能感興趣的文章:
- jquery用data方法獲取某個元素上的事件
- 對 jQuery 中 data 方法的誤解分析
- jQuery中使用data()方法讀取HTML5自定義屬性data-*實(shí)例
- Jquery中ajax方法data參數(shù)的用法小結(jié)
- jquery click([data],fn)使用方法實(shí)例介紹
- jQuery $.data()方法使用注意細(xì)節(jié)
- jQuery中index()方法用法實(shí)例
- jQuery中g(shù)et()方法用法實(shí)例
- jQuery中size()方法用法實(shí)例
- jQuery中each()方法用法實(shí)例
- jQuery中data()方法用法實(shí)例
相關(guān)文章
這篇文章主要介紹了jQuery原生的動畫效果的相關(guān)資料,需要的朋友可以參考下2015-07-07
jquery入門——事件機(jī)制之事件中的冒泡現(xiàn)象示例解釋
事件被觸發(fā)后被分為兩個階段，一個是捕獲（Capture），另一個是冒泡(Bubbing)，但大多瀏覽器并不是都支持捕獲階段，因此事件被觸發(fā)后，往往執(zhí)行冒泡過程,感興趣的朋友可以了解下，或許對你學(xué)習(xí)事件機(jī)制有所幫助2013-02-02
jquery實(shí)現(xiàn)點(diǎn)擊變換導(dǎo)航樣式的方法
這篇文章主要介紹了jquery實(shí)現(xiàn)點(diǎn)擊變換導(dǎo)航樣式的方法,可實(shí)現(xiàn)點(diǎn)擊導(dǎo)航菜單選項(xiàng)時動態(tài)變換對應(yīng)選中項(xiàng)樣式的功能,具有一定參考借鑒價值,需要的朋友可以參考下2015-08-08
這篇文章主要介紹了BootStrap按鈕標(biāo)簽及基本樣式的相關(guān)資料，基本樣式包括顏色大小方面的知識，對bootstrap按鈕相關(guān)知識感興趣的朋友一起看看吧2016-11-11
這篇文章主要為大家詳細(xì)介紹了Jquery實(shí)現(xiàn)多選下拉列表左右移動，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價值，感興趣的小伙伴們可以參考一下2022-02-02
javascript異步處理與Jquery deferred對象用法總結(jié)
這篇文章主要介紹了javascript異步處理與Jquery deferred對象用法,結(jié)合實(shí)例形式總結(jié)分析了jQuery異步請求處理相關(guān)操作技巧,需要的朋友可以參考下2019-06-06
jquery.Callbacks的實(shí)現(xiàn)詳解
這篇文章主要給大家介紹的是jQuery.Callback()的實(shí)現(xiàn),這個函數(shù)常見的應(yīng)用場景是事件觸發(fā)機(jī)制，也就是設(shè)計模式中的觀察者（發(fā)布、訂閱機(jī)制），目前Callbacks對象用于queue、ajax、Deferred對象中，下面通過這篇文章來詳細(xì)看看關(guān)于jquery.Callbacks實(shí)現(xiàn)的介紹吧。2016-11-11
本篇文章是對jquery獲取父窗口元素的實(shí)現(xiàn)方法進(jìn)行了詳細(xì)的分析介紹，需要的朋友參考下2013-06-06
最近項(xiàng)目開發(fā)中遇到這樣的功能:1.點(diǎn)擊按鈕的時候，可以進(jìn)行倒計時，倒計時自定義.2.當(dāng)接收短信失敗后，倒計時停止，可點(diǎn)擊重新發(fā)送短信.3.點(diǎn)擊的元素支持一般標(biāo)簽和input標(biāo)簽。看似很復(fù)雜其實(shí)實(shí)現(xiàn)代碼很簡單，下面小編給大家分享下實(shí)現(xiàn)代碼，需要的朋友參考下吧2017-05-05
jquery自動填充勾選框，即把勾選框打上（true），然后通過ajax方式獲得勾選項(xiàng)列表，再把列表內(nèi)的選項(xiàng)打上2014-03-03