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