DIV CSS 佈局教程網

 DIV+CSS佈局教程網 >> 網頁腳本 >> JavaScript入門知識 >> 關於JavaScript >> iframe中使用jquery進行查找的方法【案例分析】
iframe中使用jquery進行查找的方法【案例分析】
編輯:關於JavaScript     

本文實例講述了iframe中使用jquery進行查找的方法。分享給大家供大家參考,具體如下:

問題:

今天在公司是給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><input type="checkbox" id="show_img_title" class="cke_dialog_ui_hbox_first">照片標題描述帶入日記</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+"組件符合查詢條件");
}

經驗之談:

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

 

XML學習教程| jQuery入門知識| AJAX入門| Dreamweaver教程| Fireworks入門知識| SEO技巧| SEO優化集錦|
Copyright © DIV+CSS佈局教程網 All Rights Reserved