JQuery操作iframe父页面与子页面的元素与方法(实例讲解)


Posted in Javascript onNovember 20, 2013

JQUERY IFRAME
下面简单使用Jquery来操作iframe的一些记录,这个使用纯JS与可以实现。

第一、在iframe中查找父页面元素的方法:
$('#id', window.parent.document)

第二、在父页面中获取iframe中的元素方法:
$(this).contents().find("#suggestBox")

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

iframe里用jquery获取父页面body

iframe.html

<html>
<script src='jquerymin.js'>
</script>
<body id='1'>
    <div>it is a iframe</div>
</body>    
<script>
    $(document).ready(
        function()
        {        var c = $(window.parent.document.body) //麻烦的方法: var c = $($(window).eq(0)[0].parent.document).find('body'); ,忘了可以用前面的方法了
        alert(c.html());
        }
    );
</script>
</html>
Javascript 相关文章推荐
alert和confirm功能介绍
May 21 Javascript
jquery.validate.js插件使用经验记录
Jul 02 Javascript
node.js中的console.trace方法使用说明
Dec 09 Javascript
js控制div弹出层实现方法
May 11 Javascript
js简单实现Select互换数据的方法
Aug 17 Javascript
详解JavaScript函数对象
Nov 15 Javascript
vue2.0结合Element实现select动态控制input禁用实例
May 12 Javascript
vue实现类似淘宝商品评价页面星级评价及上传多张图片功能
Oct 29 Javascript
Vue基于vuex、axios拦截器实现loading效果及axios的安装配置
Apr 26 Javascript
js逆向解密之网络爬虫
May 30 Javascript
js仿360开机效果
Dec 26 Javascript
JS+CSS实现过渡特效
Jan 02 Javascript
jquery iframe操作详细解析
Nov 20 #Javascript
JS获取当前日期和时间的简单实例
Nov 19 #Javascript
js 自动播放的实例代码
Nov 19 #Javascript
鼠标滚轴控制文本框值的JS代码
Nov 19 #Javascript
jquery交替变换颜色的三种方法 实例代码
Nov 19 #Javascript
jquery ajax的success回调函数中实现按钮置灰倒计时
Nov 19 #Javascript
详解jQuery插件开发中的extend方法
Nov 19 #Javascript
You might like
php 面向对象的一个例子
2011/04/12 PHP
phpMyAdmin无法登陆的解决方法
2017/04/27 PHP
struts2 jquery 打造无限层次的树
2009/10/23 Javascript
分享十五个最佳jQuery 幻灯插件和教程
2010/03/27 Javascript
JavaScript 保存数组到Cookie的代码
2010/04/14 Javascript
JQUBar 基于JQUERY的柱状图插件
2010/11/23 Javascript
JS实现兼容性较好的随屏滚动效果
2015/11/09 Javascript
Bootstrap每天必学之工具提示(Tooltip)插件
2016/04/26 Javascript
Nodejs学习item【入门手上】
2016/05/05 NodeJs
浅析Ajax语法
2016/12/05 Javascript
利用select实现年月日三级联动的日期选择效果【推荐】
2016/12/13 Javascript
jQuery插件ajaxFileUpload使用详解
2017/01/10 Javascript
VueJs使用Amaze ui调整列表和内容页面
2017/11/30 Javascript
微信小程序出现wx.navigateTo页面不跳转问题的解决方法
2017/12/26 Javascript
JavaScript事件对象深入详解
2018/12/30 Javascript
小程序两种滚动公告栏的实现方法
2019/09/17 Javascript
Windows下安装 node 的版本控制工具 nvm
2020/02/06 Javascript
你准备好迎接vue3.0了吗
2020/04/28 Javascript
python实现稀疏矩阵示例代码
2017/06/09 Python
Python使用Selenium模块模拟浏览器抓取斗鱼直播间信息示例
2018/07/18 Python
Python.append()与Python.expand()用法详解
2019/12/18 Python
浅谈HTML5中dialog元素尝鲜
2018/10/15 HTML / CSS
Lookfantastic德国官网:英国知名美妆购物网站
2017/06/11 全球购物
php优化查询foreach代码实例讲解
2021/03/24 PHP
高中毕业自我鉴定
2013/12/22 职场文书
满月酒答谢词
2014/01/14 职场文书
村优秀党员事迹材料
2014/01/15 职场文书
军训自我鉴定
2014/01/22 职场文书
逃课检讨书
2015/01/26 职场文书
2015年学生会工作总结范文
2015/03/31 职场文书
2016年六一儿童节开幕词
2016/03/04 职场文书
2016年区委书记抓基层党建工作公开承诺书
2016/03/25 职场文书
MySQL定时备份数据库(全库备份)的实现
2021/09/25 MySQL
JavaScript异步操作中串行和并行
2021/11/20 Javascript
Windows server 2012 配置Telnet以及用法详解
2022/04/28 Servers
详解Spring Security如何在权限中使用通配符
2022/06/28 Java/Android