iframe父元素获取子页面的元素

父页面

<iframe src="iframe.html" id="iframeId" height="150" width="150"></iframe>

子页面

<div id="div">iframe页面
</div>

window.onload = function(){var _iframe = document.getElementById('iframeId').contentWindow;var _div =_iframe.document.getElementById('div');_div.style.backgroundColor = 'red';_div.onclick=function(){alert(1)}
}

子页面控制父页面

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>子页面demo13-iframe.html</title><script type="text/javascript">window.onload = function(){var _iframe = window.parent;var _div =_iframe.document.getElementById('parDiv');_div.style.color = 'red';}</script>
</head><body>
<div id='div' style='width:100px;height:100px;background-color:red;'>子页面</div>
</body>
</html>

iframe父元素获取子页面的元素相关推荐

[html] iframe父页面如何获取子页面的元素？
[html] iframe父页面如何获取子页面的元素? 在父页面监听 onmessage,子页面 postMessage.$('iframe')[0].contentWindow.document.g ...
[html] iframe父页面如何获取子页面的元素？
[html] iframe父页面如何获取子页面的元素? window.frames["iframe的id"].contentDocument.getElementsByClassN ...
父页面与子ifream传值，父页面获取子页面document元素与方法
1.父页面获取子ifream中document元素方法 window.document.getElementById('warnIfream').contentWindow.document.getE ...
layui 父页面弹框中获取子页面的内容
layer弹层组件开发文档 - Layuihttps://www.layui.site/doc/modules/layer.html#layer.getChildFrame 需求及代码分析如上图,原 ...
iframe父页面获取iframe子页面的元素与 iframe子页面获取父页面元素
一.在iframe子页面获取父页面元素代码如下:$('#objld', parent.document); 二.在父页面获取iframe子页面的元素代码如下:$("#objid", ...
js父元素获取子元素img_js获得子页面元素
在主页面中.添加iframe子页面,假设须要获得子页面的元素则能够使用javascript的contentWindow来获得,注意iframe和frameset必须加入id.详细样例例如以下: mai ...
js父元素获取子元素img_JS获取子节点、父节点和兄弟节点的方法实例总结
本文实例讲述了JS获取子节点.父节点和兄弟节点的方法.分享给大家供大家参考,具体如下: 一.js获取子节点的方式 1. 通过获取dom方式直接获取子节点其中test的父标签id的值,div为标签的名 ...
获取子页面iframe的点击事件及iframe跨域的交互
1.获取子页面iframe的点击事件 1.1.获取iframe var frame = document.getElementById('addrClick2'); 1.2.获取点击事件 var If ...
微信小程序——1、自定义顶部渐变色2、封装好的自定义顶部栏（父组件获取子组件的点击事件）
1.自定义顶部渐变色第一种使用代码实现渐变效果图: .json代码 "navigationStyle":"custom" .wxml代码 <view ...

iframe父元素获取子页面的元素

iframe父元素获取子页面的元素相关推荐

最新文章

热门文章