利用JQuery操作iframe父页面、子页面的元素和方法汇总


Posted in jQuery onSeptember 10, 2017

前言

iframe在复合文档中经常用到,利用jquery操作iframe可以大幅提高效率,本文主要给大家分享了关于简单使用JQUERY来操作IFRAME的一些记录,这个使用纯JS也可以实现。下面话不多说了,来一起看看详细的介绍吧。

第一、在iframe中查找父页面元素的方法:

$('#id', window.parent.document)

第二、在父页面中获取iframe中的元素方法:

$(this).contents().find("#suggestBox")

第三、在iframe中调用父页面中定义的方法和变量:

parent.method parent.value

JQUERY、JS调用IFRAME父窗口与子窗口元素的方法

1. jquery 在iframe子页面获取父页面元素代码如下:

$("#objid", parent.document)

2. jquery在父页面 获取iframe子页面的元素 代码如下:

$("#objid",document.frames('iframename').document)

3.js 在iframe子页面获取父页面元素代码如下:

indow.parent.document.getElementByIdx_x("元素id");

4.js 在父页面获取iframe子页面元素代码如下:

window.frames["iframe_ID"].document.getElementByIdx_x("元素id");

5.子类iframe内调用父类函数:

window.parent.func();

更多关于jquery操作iframe的技巧请大家关注这里:https://3water.com/Special/822.htm

总结

以上就是这篇文章的全部内容了,希望本文的内容对大家的学习或者工作具有一定的参考学习价值,如果有疑问大家可以留言交流,谢谢大家对三水点靠木的支持。

jQuery 相关文章推荐
jQuery Plupload上传插件的使用
Apr 19 jQuery
jQuery遍历节点方法汇总(推荐)
May 13 jQuery
jQuery中clone()函数实现表单中增加和减少输入项
May 13 jQuery
jQuery实现的弹幕效果完整实例
Sep 06 jQuery
jQuery实现判断上传图片类型和大小的方法示例
Apr 11 jQuery
jQuery中将json数据显示到页面表格的方法
May 27 jQuery
jQuery实现获取form表单内容及绑定数据到form表单操作分析
Jul 03 jQuery
jQuery easyui datagird编辑行删除行功能的实现代码
Sep 20 jQuery
jQuery ajax仿Google自动提示SearchSuggess功能示例
Mar 28 jQuery
jQuery表单选择器用法详解
Aug 22 jQuery
Jquery实现获取子元素的方法分析
Aug 24 jQuery
jquery实现异步文件上传ajaxfileupload.js
Oct 23 jQuery
jQuery事件对象的属性和方法详解
Sep 09 #jQuery
详解jquery插件jquery.viewport.js学习使用方法
Sep 08 #jQuery
jQuery选择器中的特殊符号处理方法
Sep 08 #jQuery
JQuery 获取多个select标签option的text内容(实例)
Sep 07 #jQuery
jQuery UI Draggable + Sortable 结合使用(实例讲解)
Sep 07 #jQuery
jQueryUI Sortable 应用Demo(分享)
Sep 07 #jQuery
jQuery实现的弹幕效果完整实例
Sep 06 #jQuery
You might like
通过JavaScript或PHP检测Android设备的代码
2011/03/09 PHP
php中将图片gif,jpg或mysql longblob或blob字段值转换成16进制字符串
2011/08/23 PHP
PHP7 新特性详细介绍
2016/09/06 PHP
AlertBox 弹出层信息提示框效果实现步骤
2010/10/11 Javascript
juqery 学习之三 选择器 简单 内容
2010/11/25 Javascript
不使用浏览器运行javascript代码的方法
2013/07/24 Javascript
Javascript遍历Html Table示例(包括内容和属性值)
2014/07/08 Javascript
CSS3,HTML5和jQuery搜索框集锦
2014/12/02 Javascript
JavaScript设计模式之抽象工厂模式介绍
2014/12/28 Javascript
谈谈javascript中使用连等赋值操作带来的问题
2015/11/26 Javascript
Backbone中View之间传值的学习心得
2016/08/09 Javascript
详解AngularJS中ng-src指令的使用
2016/09/07 Javascript
webpack+vue.js实现组件化详解
2016/10/12 Javascript
Jquery表单验证失败后不提交的解决方法
2016/10/18 Javascript
详解Nodejs 通过 fs.createWriteStream 保存文件
2017/10/10 NodeJs
利用node实现一个批量重命名文件的函数
2017/12/21 Javascript
web前端vue filter 过滤器
2018/01/12 Javascript
vue单页面打包文件大?首次加载慢?nginx带你飞,从7.5M到1.3M蜕变过程(推荐)
2018/01/16 Javascript
浅谈Fetch 数据交互方式
2018/12/20 Javascript
jquery实现垂直无限轮播的方法分析
2019/07/16 jQuery
[13:21]DOTA2国际邀请赛采访专栏:RSnake战队国士无双,Fnatic.Fly
2013/08/06 DOTA
[01:26]神话结束了,却也刚刚开始——DOTA2新英雄玛尔斯驾临战场
2019/03/10 DOTA
Python多进程同步Lock、Semaphore、Event实例
2014/11/21 Python
python更改已存在excel文件的方法
2018/05/03 Python
Pycharm中安装Pygal并使用Pygal模拟掷骰子(推荐)
2020/04/08 Python
CSS3 滤镜 webkit-filter详细介绍及使用方法
2012/12/27 HTML / CSS
Myprotein瑞典官方网站:畅销欧洲英国运动营养品牌
2018/01/22 全球购物
C语言变量的命名规则都有哪些
2013/12/27 面试题
委托书范本
2014/04/02 职场文书
股份合作协议书
2014/04/12 职场文书
工作失职检讨书500字
2014/10/17 职场文书
2015年全民国防教育日活动总结
2015/03/23 职场文书
2015年母亲节寄语
2015/03/23 职场文书
Nginx开启Brotli压缩算法实现过程详解
2021/03/31 Servers
Python Pytorch查询图像的特征从集合或数据库中查找图像
2022/04/09 Python
三种方式清除vue路由跳转router-link的历史记录
2022/04/10 Vue.js