iframe父页面与子页面之间的元素获取与方法调用

最新推荐文章于 2023-06-16 11:26:41 发布
最新推荐文章于 2023-06-16 11:26:41 发布
阅读量967 收藏 3
点赞数
分类专栏： JQuery&JS学习
原文链接：https://blog.csdn.net/wttykj/article/details/78538592
版权

JS

 
 父页面调用子页面子页面调用父页面
元素window.frames[iframe的name属性值];① window.parent.document.getElementById("父页面元素ID");
②window.parent.document.getElementsByTagName("父页面元素标签名")[i];
③window.parent.document.getElementsByClassName("父页面元素类名")[i];
方法① document.getElementById("子页面元素ID").contentWindow.子页面方法名;
② document.getElementsByTagName("子页面元素标签名")[i].contentWindow.子页面方法名;
③ document.getElementsByClassName("子页面元素类名")[i].contentWindow.子页面方法名;		window.parent.父页面方法;

 

JQuery

 父页面调用子页面子页面调用父页面
元素$(iframe选择器).contents().find(iframe中元素选择器)① $(父页面元素选择器, window.parent.document);
② window.parent.$(父页面元素选择器)window.parent.父页面方法;
方法$(iframe选择器)[0].contentWindow.子页面方法名window.parent.父页面方法;

 

机械键盘侠
关注
  • 0
    点赞
  • 踩
  • 3
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
jquery、js调用iframe父窗口与子窗口元素的方法整理
12-09
1. jquery 在iframe子页面获取父页面元素代码如下: $(“#objid”, parent.document) 2. jquery在父页面 获取iframe子页面的元素 代码如下: $(“#objid”,document.frames(‘iframename’).document) 3.js 在iframe子...
父页面和子页面的传值和获取
do what you like && brave
06-30 4853
js中子页面父页面方法 变量相互调用 （1）子页面调用父页面的方法或者变量：window.parent.方法()或者变量名window.parent相当于定位到父页面  之后的操作和在父页面中写代码一样写window.parent.aa();//调取aa函数 window.parent.bb;//调取bb变量 例如：想在子页面中得到id为aaa的文本框的值 window.parent.$("#...
父页面获取子页面数据
X_lywfc的博客
11-25 1581
//注意：parent 是 JS 自带的全局对象，可用于操作父页面 var index = parent.layer.getFrameIndex(window.name); //获取窗口索引 //让层自适应iframe $('#add').on('click', function(){ $('body').append('插入很多酱油。插入很多酱油。插入很多酱油。插入很多酱油。插入很多酱油...
JQ/JS 父页面获取iframe子窗口的元素
cksdbb的博客
09-01 1万+
无论是原生的js还是jquery，我们必须在iframe加载完毕以后才能进行操作获取子页面的元素进行相应的操作。 方法1：原生JS进行父页面获取iframe子窗口的元素 document.getElementById('iframeId').contentWindow.document.getElementsById('iframe子页面Id') window.frames["iframeID"].document.getElementsByClassName('iframe子页面ID') .
jquery 父、子页面之间页面元素的获取，方法的调用
热门推荐
dwc2011的专栏
09-02 3万+
父、子页面之间页面元素的获取，方法的调用：
父页面取子页面的数据或者值，父页面取iframe值或者数据
m0_37615458的博客
04-16 3382
前提，得引jQuery这不说了吧。 如果父页面想获取子页面的一些数据或者一些值，或者想获取iframe的一些值或者数据，那么可以使用以下书写方式。 demo1 1.子页面准备好需要传递的数据（怎么准备随意吧）此处我准备的data数据是json格式 2.子页面 parent.outputDataCallBack(data); //outputDataCallBack名称随意，同事喜...
在父页面获取子页面元素值的方法
lhy_luan
11-27 6116
当在一个html父页面中嵌入html子页时，当点击父页面的元素需要读取或者操作子页面元素时，以下方法十分有效。<!-- fu.html --> <!DOCTYPE html> <html> <head> <title></title> <meta charset="UTF-8"> </head> <body> <div> <iframe src="./zi.h
iframe子级获取父级的元素、方法，父级获取子级的元素、方法
weixin_44111803的博客
03-21 1577
iframe子级获取父级的元素、方法，父级获取子级的元素、方法
关于iframe页面式后台管理系统中父子页面互相获取元素问题以及获取index页面导航栏元素等问题
weixin_42826247的博客
02-25 555
关于iframe页面式后台管理系统中父子页面互相获取元素问题 接触了很多后台管理系统，大多为下图所示的左右布局页面，同时页面核心加载采用iframe嵌套 在实际开发中，有时某一个iframe子菜单页面中操作后需要跳转到另一个菜单中，例如：在新增招标项目页确认新增后需求跳转到招标信息列表页，思路无非是在新增数据页获取index页面招标信息列表的元素，触发它的点击事件。但此时因为是使用框架，无法获取...
页面嵌套iframe怎么调用父页面的方法，子页面回调父页面函数方法
橙-极纪元-cplvfx-JJY.Cheng
06-19 1万+
页面嵌套iframe怎么调用父页面的方法，子页面回调父页面函数方法, iframe子父页面间js的相互调用
iframe父页面调用子页面方法，并且获取数据（无跨域）
weixin_48195664的博客
06-16 2274
以上就是 iframe父页面调用子页面方法，并且获取数据（无跨域）最难部分就是跨越了。一定要注意：父子页面两边都要监听，子页面监听父页面传过来的参数，再根据参数判断调取哪个方法。父页面监听子页面传过来的数据。(注意：VUE的话将此方法写在mounted里边，如果是多次调取此方法的话，就换成window.onmessage=(e)=>{}2. 监听父页面传过来的参数来判断调取哪个方法。
jQuery基于ID调用指定iframe页面内的方法
10-22
主要介绍了jQuery基于ID调用指定iframe页面内的方法,涉及jQuery针对页面框架元素的选择与方法的调用技巧,具有一定参考借鉴价值,需要的朋友可以参考下
layer.open关闭父窗口 以及调用父页面的方法
12-10
//关闭iframe页面 var index = parent.layer.getFrameIndex(window.name); //获取窗口索引 parent.layer.close(index); //父类方法 function exportData(shownum,splitstr){ //TODO } 以上这篇layer.open关闭父窗口 ...
layer弹出子iframe层父子页面传值的实现方法
12-10
父页面获取子页面元素 格式： $("#iframeID").contents().find("#eleID") 示例代码： father.html <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>...
跨域修改iframe页面内容详解
12-13
由于代理页与目标页同域, 所以代理页可以获取并操作目标页的document对象. 前提条件 需要将proxy.html放到与内嵌的iframe页同域的服务下, 并且可以被访问到. 使用 支持2种调用方式: 使用 postMessage 和 URL params....
关于__Federico Milano 的电力系统分析工具箱.zip
04-26
1.版本：matlab2014/2019a/2021a 2.附赠案例数据可直接运行matlab程序。 3.代码特点：参数化编程、参数可方便更改、代码编程思路清晰、注释明细。 4.适用对象：计算机，电子信息工程、数学等专业的大学生课程设计、期末大作业和毕业设计。
mlab-upenn 研究小组的心脏模型模拟.zip
04-26
1.版本：matlab2014/2019a/2021a 2.附赠案例数据可直接运行matlab程序。 3.代码特点：参数化编程、参数可方便更改、代码编程思路清晰、注释明细。 4.适用对象：计算机，电子信息工程、数学等专业的大学生课程设计、期末大作业和毕业设计。
混合图像创建大师matlab代码.zip
最新发布
04-26
1.版本：matlab2014/2019a/2021a 2.附赠案例数据可直接运行matlab程序。 3.代码特点：参数化编程、参数可方便更改、代码编程思路清晰、注释明细。 4.适用对象：计算机，电子信息工程、数学等专业的大学生课程设计、期末大作业和毕业设计。
中序遍历二叉树-java版本
04-26
在Java中，实现二叉树的中序遍历同样可以通过递归来完成。中序遍历的顺序是：首先递归地中序遍历左子树，然后访问根节点，最后递归地中序遍历右子树。 在这段代码中，Node类定义了二叉树的节点，BinaryTree类包含一个指向根节点的指针和inOrder方法，用于递归地进行中序遍历。printInOrder方法调用inOrder方法并打印出遍历的结果。 在Main类中，我们创建了一个示例二叉树，并调用printInOrder方法来输出中序遍历的结果。输出应该是：4 2 5 1 3，这表示中序遍历的顺序是左子树（4），然后是根节点（2），接着是右子树的左子树（5），然后是右子树的根节点（1），最后是右子树的右子树（3）。
js如何判断是否在iframe中/JQuery调用iframe父页面元素与方法
08-25
// 使用parent()方法获取父页面元素并进行操作 $("button", parent.document).click(function(){ // 在父页面中查找元素，并添加点击事件处理函数 alert("在父页面中点击了按钮"); }); // 使用window.parent获取...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值