什么是iframe?

iframe 元素会创建包含另外一个文档的内联框架（即行内框架）。可以理解为把iframe解释成“浏览器中的浏览器“

在IE中：

  1. document.frames[i].document.getElementById('元素的ID');

或：

  1. document.frames['iframe的name'].document.getElementById('元素的ID');

直接上代码：

总共有两个html文件

这上1.html文件，代码如下：

  1. <html>
  2. <head>
  3. <title>这是1.html</title>
  4. <meta charset="UTF-8">
  5. </head>
  6. <body>
  7. <p>这是1.html的内容这是1.html的内容这是1.html的内容这是1.html的内容</p>
  8. <input type="button" onClick="show()" value="提取2.html的内容">
  9. <hr style="color:green;height:1px" />
  10. <div id="ss"></div>
  11. <iframe src="2.html" name="myframe" id="haha" style="display:none"></iframe>
  12. </body>
  13. </html>
  14. <script language="javascript">
  15. function show(){
  16.     var xx=window.frames["myframe"].document.getElementById("bd").innerHTML;
  17.         // 以下通过id来获取也是可以的，同样的效果
  18.     //  var xx=document.getElementById("haha").contentWindow.document.getElementById("bd").innerHTML;
  19.       document.getElementById("ss").innerHTML=xx;
  20.  
  21.  }
  22. </script>

2.html的代码如下：

  1. <html>
  2. <head>
  3. <title>这是2.html</title>
  4. </head>
  5. <body id="bd">
  6. 这是2.html的内容这是2.html的内容这是2.html的内容这是2.html的内容这是2.html的内容这是2.html的内容<br>
  7. 这是2.html的内容这是2.html的内容这是2.html的内容这是2.html的内容这是2.html的内容这是2.html的内容<br>
  8. 这是2.html的内容这是2.html的内容这是2.html的内容这是2.html的内容这是2.html的内容这是2.html的内容<br>
  9. <input type="button" value="这是2.html的内容"> <br>
  10. </body>
  11. </html>

在safari中的运行结果如我们所愿：

点击按钮后的效果图上：

在goole chrome中就没那么幸运了，无论怎么改都报错检查效果图上：

原因：跨域,file:///类型的也算跨域,chrome对于file协议有安全限制，无法用js访问本地资源，对于http则是好的，所以上面页面要是在iis/apache网站中打开应该是没问题的 。。chrome要发布网站同源的才能互相操作，本地测试操作不了iframe，安全问题，chrome本地也用不了ajax请求本地文件，又有说法是chrome的内核不支持iframe 这个属性。

两个本地(localhost)html文件之间的传值的更多相关文章

  1. Visual Studio 中两个窗体（WinForm）之间相互传值的方法

    编写WinowsForm应用程序时,实现两个窗体之间相互传递值的方法其实很简单.以下用一个例子说明:在名为FormMain主窗体运行过程中利用名为FormInfo窗体,获取用户输入信息,并将这些信息返 ...

  2. php 两个文件之间的相对路径的计算方法

    php 两个文件之间的相对路径的计算方法 比如: 文件A 的路径是 /home/web/lib/img/cache.php 文件B的路径是 /home/web/api/img/show.php 那么. ...

  3. .Net 环境下C# 通过托管C++调用本地C++ Dll文件

     综述 : 本文章介绍.Net 环境下C# 通过托管C++调用本地C++ Dll文件, 示例环境为:VS2010, .Net4.0, Win7. 具体事例为测试C++, C#, 及C#调用本地C++D ...

  4. 微信小程序-02-项目文件之间配合和调用关系

    微信小程序-02-项目文件之间配合和调用关系 我就不说那么多了,我是从官方文档拷贝的,然后加上一些自己的笔记,不喜勿喷 官方文档:https://developers.weixin.qq.com/mi ...

  5. Lsyncd搭建同步镜像-用Lsyncd实现本地和远程服务器之间实时同步

    Lysncd即Live Syncing Daemon,它是开源的数据实时同步工具(后台进程),基于inotify和rsync. lsyncd会密切监测本地服务器上的参照目录,当发现目录下有文件或目录变 ...

  6. comm---两个文件之间的比较

    comm命令可以用于两个文件之间的比较,它有一些选项可以用来调整输出,以便执行交集.求差.以及差集操作. 交集:打印出两个文件所共有的行. 求差:打印出指定文件所包含的且不相同的行. 差集:打印出包含 ...

  7. Linux ln命令：在文件之间建立链接（硬链接和软链接）详解版1

    Linux ln命令:在文件之间建立链接(硬链接和软链接)详解版 < Linux创建文件及修改文件时间戳(touch命令)Linux复制文件和目录(cp命令) > <Linux就该这 ...

  8. JAXB—Java类与XML文件之间转换

    JAXB-Java类与XML文件之间转换 简介         JAXB(Java Architecture for XML Binding) 是一个业界的标准,是一项可以根据XML Schema产生 ...

  9. linux – tty,ttyS,pts,ptmx,vcs,vcsa设备文件之间的区别？(/dev/tty等)

    linux – tty,ttyS,pts,ptmx,vcs,vcsa设备文件之间的区别? 终端有字符终端和图形终端两种模式.在linux的图形环境下,我们可以通过鼠标点击来完成所有的管理任务,这是图形 ...

随机推荐

  1. ios 使用block中使用self可能产生的循环引用

    在block中调用 self,那么就会引起循环引用问题,那么这是为什么呢? 为什么self会对block进行强引用呢???? 这里推荐一篇关于block的专业文章,http://blog.csdn.n ...

  2. Win7下同时使用有线和无线时的优先级设置

    终于找到这个问题的解决方案了!!!!我是通过方法1改跃点数实现的,方法2无效. http://linshengling.blog.163.com/blog/static/114651912012102 ...

  3. K3已被禁用的基础资料如何显示出来

    [基础资料]——[公共资料]——[物料.职员.客户==]——[查看]——[选项]——显示禁用基础资料——确定,就可以看见你所禁用过的基础资料,显示为红色字体! 同类问题example: 金蝶K3 禁用 ...

  4. iOS-UIView 之 layoutMargins & preservesSuperviewLayoutMargins 解惑

    这里先看下苹果给出的解释: iOS8.0之后,uiview默认layoutMargins 为(8,8,8,8),也可以自己指定,仅适用于自动布局:当添加子view到父view上时,这样设置好约束 默认 ...

  5. telnet测试制定地址端口号

    cmd下,命令 telnel+空格+ip或者网站+空格+端口号 端口可以用: 需要开通windows服务:

  6. SharedPreferences详解(三)——存取图片

    MainActivity如下: package cc.sp; import java.io.ByteArrayInputStream; import java.io.ByteArrayOutputSt ...

  7. 【leetcode】Bitwise AND of Numbers Range（middle）

    Given a range [m, n] where 0 <= m <= n <= 2147483647, return the bitwise AND of all numbers ...

  8. HDU 1159 Common Subsequence --- DP入门之最长公共子序列

    题目链接 基础的最长公共子序列 #include <bits/stdc++.h> using namespace std; ; char c[maxn],d[maxn]; int dp[m ...

  9. MD(markdown)语法

    #标题1 ##标题2 段落->空行分隔 `加背景` [超链接](https://www.baidu.com) **加粗** _斜体_ ~~删除线~~ . 列表一 . 列表二 图片: ![alt ...

  10. class－dump获取iOS私有api

    转自:http://blog.csdn.net/sunyuanyang625/article/details/41440167 获取各类iOS私有api 安装工具class-dump 资源地址http ...