一个页面A.html使用iframe嵌套一个页面B.html，在A页面写js操作B页面HTML元素，首先要获取到B页面document对象，才能对嵌套页面进行操作

请看一个实例，在A页面写js操作B页面div的内容：

A.html代码：

<!DOCTYPE html>

<html>

    <head>

        <meta charset="UTF-8">

        <title></title>

        <script type="text/javascript" src="js/jquery-1.9.1.min.js" ></script>

    </head>

    <body >

        <iframe name="iframe1" src="B.html"></iframe>

    </body>

</html>

<script>

        window.onload=()=>{

                $(window.frames["iframe1"].document).on("click","#btn",function(){  //window.frames["iframe1"].document获的iframe标签嵌套页面document对象

                    $(this).html("1123");

                })

        }

</script>

B页面代码：

<!DOCTYPE html>

<html>

    <head>

        <meta charset="UTF-8">

        <title></title>

        <script type="text/javascript" src="js/jquery-1.9.1.min.js" ></script>

    </head>

    <body id="body">

        <div id="btn" >测试操作</div>

    </body>

</html>

当点击 “测试操作” 时就这个文字就被修改成“”

父页面操作嵌套iframe子页面的HTML标签元素的更多相关文章

  1. 高并发分布式系统中生成全局唯一（订单号）Id js返回上一页并刷新、返回上一页、自动刷新页面 父页面操作嵌套iframe子页面的HTML标签元素 .net判断System.Data.DataRow中是否包含某列 .Net使用system.Security.Cryptography.RNGCryptoServiceProvider类与System.Random类生成随机数

    高并发分布式系统中生成全局唯一(订单号)Id   1.GUID数据因毫无规律可言造成索引效率低下,影响了系统的性能,那么通过组合的方式,保留GUID的10个字节,用另6个字节表示GUID生成的时间(D ...

  2. 父页面操作iframe子页面的安全漏洞及跨域限制问题

    一.父子交互的跨域限制 同域情况下,父页面和子页面可以通过iframe.contentDocument或者parent.document来交互(彼此做DOM操作等,如父页面往子页面注入css). 跨域 ...

  3. 子窗口访问父页面iframe中的iframe，top打开的子窗口访问父页面中的iframe中的iframe

    子窗口访问父页面iframe中的iframe 子窗口访问最顶层页面中的iframe中的iframe top打开的子窗口访问父页面中的iframe中的iframe top打开的子窗口访问最顶层页面中的i ...

  4. 页面中嵌套iframe，微信浏览器长按二维码识别不了

    问题:在微信浏览器内,页面中嵌套iframe,iframe中用户触发事件后有个弹框会显示二维码,用户长按二维码可以识别并跳转.尝试了一下,安卓是正常的,但是ios是识别不了的. 解决过程: 1.这里客 ...

  5. ionic3隐藏子页面的tabs和配置返回按钮

    在app.modlues.ts文件中修改 imports: [ BrowserModule, IonicModule.forRoot(MyApp, { tabsHideOnSubPages: 'tru ...

  6. 今天做一个项目的时候，要在一个编辑的jsp页面的textarea标签设置value属性，结果发现他没有value属性，但是是编辑页面又必须要回显要修改的内容，所以在参考了w3cschool之后很轻松的解决了这个问题。

    今天做一个项目的时候,要在一个编辑的jsp页面的textarea标签设置value属性,结果发现他没有value属性,但是是编辑页面又必须要回显要修改的内容,所以在参考了w3cschool之后很轻松的 ...

  7. iframe 父页面调用子页面的vue方法

                    父页面代码:            html: <div id="app"> //省略业务代码x行..... <iframe sr ...

  8. iframe子元素相对于父页面滚动条固定(iframe无滚动条，iframe固定高度有滚动条，两种情况)

    一.当iframe自适应高度,无滚动条时候: 例如这样: //随着父页面滚动条滚动定位“#qn-quc”他的位置固定在顶部 $(parent.window).scroll(function() { v ...

  9. 父页面刷新 保持iframe页面url不变

    思路:点击父页面时写cookies-->刷新时从cookies中奖内容读取出来. 本文转自:http://blog.163.com/sdolove@126/blog/static/1146378 ...

随机推荐

  1. Oracle ORA-12541:TNS:无监听程序

    背景:自己机子做oracle服务器,其他机子可以ping得通我的机子,但是jdbc就是连不上,后来用plsql连出现无监听程序.... 我昨天重新安装Oracle后,用PL/SQL Developer ...

  2. Charles抓包http和https

    本来不打算写的,度娘一搜一大堆各种教程,实在是网上的各种设置的各种坑都有,我还是站在巨人的肩膀上汇总一下吧 首先http的就不用说了,各种教程版本区别不大,也没什么坑,主要是https: 第一步先下载 ...

  3. Hbase常用Shell命令

    status 查看系统状态 hbase(main):010:0> status 1 active master, 0 backup masters, 4 servers, 0 dead, 6.5 ...

  4. android:ProgressDialog控件

    ProgressDialog 和 AlertDialog 有点类似,都可以在界面上弹出一个对话框,都能够屏蔽 掉其他控件的交互能力.不同的是,ProgressDialog 会在对话框中显示一个进度条, ...

  5. 编码原则：最小化使用控制结构（条件和循环）续：告别 break 和 continue

    如果最小化的使用了for.while等控制结构,那么,之前控制结构对应的两个控制语句(break he continue)也需要有对应的替换方案,好在几乎所有支持高阶函数的语言的集合API都有支持.

  6. IEEE 754二进制浮点数算术标准

    可能很多人都遇到过浮点数精度丢失的问题,下面以JavaScript为例. 1 - 0.9 = 0.09999999999999998 纳尼,不应该是0.1么,怎么变成0.099999999999999 ...

  7. mysql从库Last_IO_Error: Got fatal error 1236 from master when reading data from binary log: 'Could not find first log file name in binary log index file'报错处理

    年后回来查看mysql运行状况与备份情况,登录mysql从库查看主从同步状态 mysql> show slave status\G; *************************** . ...

  8. 解决Matlab画图直接保存.eps格式而导致图不全的问题

    Matlab确是一款简单方便的工具,使用此工具绘图也是我们常用的一种手段,可是如果我们想将此图片保存成.eps格式并应用于latex中,就有可能会出现.eps格式的图片显示不全的问题,这个着实让我们头 ...

  9. Tomcat增加虚拟内存(转)

    程序要遍历读取xml并写入数据库,需要占用大量内存 如果数据量大则报错 Exception in thread "Timer-0" java.lang.OutOfMemoryErr ...

  10. Next Permutation leetcode java

    题目: Implement next permutation, which rearranges numbers into the lexicographically next greater per ...