使用jquery/js獲取iframe父子級(jí)、同級(jí)獲取元素的方法

更新時(shí)間：2016年08月05日 12:10:34 投稿：jingxian

下面小編就為大家?guī)硪黄褂胘query/js獲取iframe父子級(jí)、同級(jí)獲取元素的方法。小編覺得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧

在web開發(fā)中，經(jīng)常會(huì)用到iframe，難免會(huì)碰到需要在父窗口中使用iframe中的元素、或者在iframe框架中使用父窗口的元素

在父窗口中獲取iframe中的元素

1、

格式：window.frames["iframe的name值"].document.getElementById("iframe中控件的ID").click();

實(shí)例：window.frames["ifm"].document.getElementById("btnOk").click();

2、

格式：

var obj=document.getElementById("iframe的name").contentWindow;
var ifmObj=obj.document.getElementById("iframe中控件的ID");
ifmObj.click();

實(shí)例：

var obj=document.getElementById("ifm").contentWindow;

var ifmObj=obj.document.getElementById("btnOk");

ifmObj.click();

在iframe中獲取父窗口的元素

格式：window.parent.document.getElementById("父窗口的元素ID").click();

實(shí)例：window.parent.document.getElementById("btnOk").click();

jquery

在父窗口中獲取iframe中的元素

1、

格式：$("#iframe的ID").contents().find("#iframe中的控件ID").click();//jquery 方法1

實(shí)例：$("#ifm").contents().find("#btnOk").click();//jquery 方法1

2、

格式：$("#iframe中的控件ID",document.frames("frame的name").document).click();//jquery 方法2

實(shí)例：$("#btnOk",document.frames("ifm").document).click();//jquery 方法2

在iframe中獲取父窗口的元素

格式：$('#父窗口中的元素ID', parent.document).click();

實(shí)例：$('#btnOk', parent.document).click();

以上這篇使用jquery/js獲取iframe父子級(jí)、同級(jí)獲取元素的方法就是小編分享給大家的全部?jī)?nèi)容了，希望能給大家一個(gè)參考，也希望大家多多支持腳本之家。

您可能感興趣的文章:

相關(guān)文章

jquery實(shí)現(xiàn)垂直無限輪播的方法分析
這篇文章主要介紹了jquery實(shí)現(xiàn)垂直無限輪播的方法,結(jié)合實(shí)例形式分析了jQuery無限輪播相關(guān)界面布局、樣式與頁面元素動(dòng)態(tài)操作實(shí)現(xiàn)技巧,需要的朋友可以參考下
2019-07-07
js原生態(tài)函數(shù)中使用jQuery中的 $(this)無效的解決方法
今天遇到一個(gè)聽郁悶的問題，正如title所說 js中原生態(tài)函數(shù)在jQuery 中使用 $(this) 被解析成undefined
2011-05-05
jquery win 7透明彈出層效果的簡(jiǎn)單代碼
jquery win 7透明彈出層效果，點(diǎn)擊可以彈出一個(gè)透明層的jquery特效,插件可以調(diào)彈出框的寬度和高度，很不錯(cuò)的一個(gè)彈出層插件。
2013-08-08
動(dòng)態(tài)設(shè)置form表單的action屬性的值的簡(jiǎn)單方法
下面小編就為大家?guī)硪黄獎(jiǎng)討B(tài)設(shè)置form表單的action屬性的值的簡(jiǎn)單方法。小編覺得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧
2016-05-05
jQuery布局組件EasyUI Layout使用方法詳解
這篇文章主要為大家詳細(xì)介紹了jQuery布局組件EasyUI Layout的使用方法，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2017-02-02
jQuery實(shí)現(xiàn)簡(jiǎn)單日期格式化功能示例
這篇文章主要介紹了jQuery實(shí)現(xiàn)簡(jiǎn)單日期格式化功能,涉及jQuery調(diào)用javascript針對(duì)日期格式轉(zhuǎn)換擴(kuò)展實(shí)現(xiàn)日期格式化功能相關(guān)操作技巧,需要的朋友可以參考下
2017-09-09
jquery 必填項(xiàng)判斷表單是否為空的方法
jquery 表單驗(yàn)證,檢測(cè)表單是否為空
2008-09-09
jQuery實(shí)現(xiàn)返回頂部按鈕和scroll滾動(dòng)功能[帶動(dòng)畫效果]
這篇文章主要介紹了jQuery實(shí)現(xiàn)返回頂部按鈕和scroll滾動(dòng)功能[帶動(dòng)畫效果],需要的朋友可以參考下
2017-07-07
jquery獲取復(fù)選框被選中的值
這篇文章主要介紹了如何使用jquery獲取復(fù)選框被選中的值,需要的朋友可以參考下
2014-04-04
jQuery 使用手冊(cè)(四)
jQuery 使用手冊(cè)，大家可以耐心的看完，就基本上入門了。
2009-09-09