iframe中使用jquery進(jìn)行查找的方法【案例分析】

更新時(shí)間：2016年06月17日 12:06:37 作者：hbiao68

這篇文章主要介紹了iframe中使用jquery進(jìn)行查找的方法,結(jié)合實(shí)際案例形式較為詳細(xì)的分析了jQuery結(jié)合iframe查找的相關(guān)技巧,具有一定參考借鑒價(jià)值,需要的朋友可以參考下

本文實(shí)例講述了iframe中使用jquery進(jìn)行查找的方法。分享給大家供大家參考，具體如下：

問(wèn)題：

今天在公司是給ckeditor添加一個(gè)“是否顯示”圖片標(biāo)題的功能

難點(diǎn)：

插件的內(nèi)容很多，功能相當(dāng)強(qiáng)大，在短時(shí)間之內(nèi)無(wú)法通讀和理解里面的邏輯關(guān)系，而且修改的內(nèi)容不能破壞插件內(nèi)部的邏輯關(guān)系，不能因?yàn)樘砑右粋€(gè)功能而引入更多的問(wèn)題，因此只能從局部去解決這個(gè)問(wèn)題

突破口：

知道頁(yè)面時(shí)使用iframe框架插入的html，頁(yè)面有些初始化的功能是在這里完成的，因此在這里添加這個(gè)checkbox組件，然后根據(jù)最后的window去尋找自己想要處理的window對(duì)象——window.parent.document.body

jQuery(expression, [context])——如果指定了 context 參數(shù)，如一個(gè) DOM 元素集或 jQuery 對(duì)象，那就會(huì)在這個(gè) context 中查找。

下面這個(gè)例子就是想在iframe的父窗口中添加組件

復(fù)制代碼代碼如下:

$('tr.cke_dialog_ui_hbox', parent.document.body).prepend('<td><input type="checkbox" id="show_img_title" class="cke_dialog_ui_hbox_first">照片標(biāo)題描述帶入日記</td>');

不能在閉包里面去訪問(wèn)動(dòng)態(tài)添加的組件，因?yàn)樵陧?yè)面加載的時(shí)候就已經(jīng)運(yùn)行了閉包里面的東西，但是頁(yè)面還沒(méi)有添加ID為kkkk的組件，使用$("#kkkk")得到的值就為空，這樣不能實(shí)現(xiàn)預(yù)期的目的，出現(xiàn)異常的現(xiàn)象，在瀏覽器中會(huì)報(bào)腳本錯(cuò)誤

如何判斷jquery是否查找到符合條件的對(duì)象？

if(0==$(".check_show_img_title", parent.document.body).length){
   alert("沒(méi)有查找到對(duì)象");
}else{
  alert("有"+$(".check_show_img_title", parent.document.body).length+"組件符合查詢(xún)條件");
}

經(jīng)驗(yàn)之談：

在頁(yè)面中動(dòng)態(tài)添加了組件之后，由于刷新頁(yè)面就恢復(fù)了正常初始化的狀態(tài)，但是如果是局部刷新，可能會(huì)添加多個(gè)組件，但是如果只需要一個(gè)組件，則就是在離開(kāi)頁(yè)面的時(shí)候刪除自己動(dòng)態(tài)添加的組件，這樣問(wèn)題就來(lái)了，可能在不同的瀏覽器中不能刪除，這樣就會(huì)很郁悶，產(chǎn)生出瀏覽器兼容的問(wèn)題，既然是這樣那么可以換一種思維方式，在某種狀態(tài)（在標(biāo)簽中添加屬性）下就添加，否則就不添加，這樣就不用去刪除自己添加的組件了，換種方式解決了瀏覽器兼容的問(wèn)題

更多關(guān)于jQuery相關(guān)內(nèi)容感興趣的讀者可查看本站專(zhuān)題：《jQuery常用插件及用法總結(jié)》、《jquery中Ajax用法總結(jié)》、《jQuery表格(table)操作技巧匯總》、《jQuery拖拽特效與技巧總結(jié)》、《jQuery擴(kuò)展技巧總結(jié)》、《jQuery常見(jiàn)經(jīng)典特效匯總》、《jQuery動(dòng)畫(huà)與特效用法總結(jié)》及《jquery選擇器用法總結(jié)》

希望本文所述對(duì)大家jQuery程序設(shè)計(jì)有所幫助。

您可能感興趣的文章: