jquery查找iframe裡元素方法詳解

這次帶給大家jquery查找iframe裡元素方法詳解，jquery查找iframe裡元素的注意事項有哪些，下面就是實戰案例，一起來看一下。

問題：

今天在公司是為ckeditor新增一個「是否顯示」圖片標題的功能

##困難：

外掛程式的內容很多，功能相當強大，在短時間內無法通讀和理解裡面的邏輯關係，而且修改的內容不能破壞插件內部的邏輯關係，不能因為添加一個功能而引入更多的問題，因此只能從局部去解決這個問題

突破口：

#知道頁面時使用iframe

框架插入的html，頁面有些初始化的功能是在這裡完成的，因此在這裡添加這個checkbox元件，然後根據最後的window去尋找自己想要處理的window物件——window.parent.document .body

jQuery(expression, [context])－如果指定了context 參數，如DOM 元素集或jQuery 對象，那就會在這個context 中尋找。

下面這個範例就是想在iframe的父視窗中加入元件

#複製程式碼 程式碼如下：

$( 'tr.cke_dialog_ui_hbox', parent.document.body).prepend('照片標題描述日記頁>/td> ;');

不能在閉包裡面去訪問動態添加的元件，因為在頁面加載的時候就已經運行了閉包裡面的東西，但是頁面還沒有添加ID為kkkk的組件，使用$("#kkkk")得到的值就為空，這樣不能實現預期的目的，出現異常的現象，在瀏覽器中會報腳本錯誤

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

if(0==$(".check_show_img_title", parent.document.body).length){
   alert("没有查找到对象");
}else{
  alert("有"+$(".check_show_img_title", parent.document.body).length+"组件符合查询条件");
}

經驗之談：

在頁面中動態添加了元件之後，由於刷新頁面就恢復了正常初始化的狀態，但是如果是局部刷新，可能會添加多個組件，但是如果只需要一個組件，則就是在離開頁面的時候刪除自己動態添加的組件，這樣問題就來了，可能在不同的瀏覽器中不能刪除，這樣就會很鬱悶，產生出瀏覽器相容的問題，既然是這樣那麼可以換一種思維方式，在某種狀態（在標籤中添加屬性）下就添加，否則就不添加，這樣就不用去刪除自己添加的組件了，換種方式解決了瀏覽器相容的問題

相信看了本文案例你已經掌握了方法，更多精彩請關注php中文網其它相關文章！

推薦閱讀：

取得iframe中document物件步驟詳解

iframe中頁面錨點失效如何處理

以上是jquery查找iframe裡元素方法詳解的詳細內容。更多資訊請關注PHP中文網其他相關文章！