`

js获取iframe对象,跨域操作?

    博客分类:
  • js
阅读更多
//通过这样即可获取iframe中的元素
document.getElementById("myFrame").contentWindow.document.getElementById('ss').innerHTML;

// 等价于
window.frames[0] // is the same thing as 
document.getElementsByTagName("iframe")[ 0 ].contentWindow


var frames = window.frames; // or // var frames = window.parent.frames;
for (var i = 0; i < frames.length; i++) { 
  // do something with each subframe as frames[i]
  frames[i].document.body.style.background = "red";
}


window.onload = (function () { 
var iObj = document.getElementById('iId').contentWindow; 
alert(iObj.document.getElementsByTagName('h1')[0].firstChild.data); 
});
//此方法经过ie6,ie7,firefox2.0,firefox3.0测试都通过


// firefox下访问操作iframe里内容
var iObj = document.getElementById('iId').contentDocument; 
alert(iObj.getElementsByTagName('h1')[0].innerHTML='我想变成她一天的一部分'); 
alert(iObj.getElementsByTagName('p')[0].firstChild.data);


//通过designMode(设置文档为可编辑设计模式)和contentEditable(设置内容为可编辑),你可以重写iframe里的内容。代码:

var iObj = document.getElementById('iId').contentWindow; 
iObj.document.designMode = 'On'; 
iObj.document.contentEditable = true; 
iObj.document.open(); 
iObj.document.writeln('<html><head>'); 
iObj.document.writeln('<style>body {background:#000;font-size:9pt;margin: 2px; padding: 0px;}</style>'); 
iObj.document.writeln('</head><body></body></html>'); 
iObj.document.close();


// JS获取iframe元素及跨域访问操作
http://www.ribenyu.cn/space-1-do-blog-id-3443.html
分享到:
评论

相关推荐

    完美解决iframe跨域问题

    3. **iframe跨域问题**:当iframe加载的页面与包含它的页面不在同一个域时,就会出现跨域问题,导致无法直接通过JavaScript进行通信,如获取iframe内的内容、设置iframe的属性等。 **二、iframe跨域的解决方案** 1...

    JS获取iframe内容【简化版】

    ### JS获取iframe内容【简化版】 #### 知识点概览 本文将详细介绍如何通过JavaScript(简称JS)来获取一个内嵌在当前页面中的iframe的内容。这种方法特别适用于那些需要动态加载或更新iframe内部数据的应用场景。...

    JS操作iframe里的dom(实例讲解)

    在JavaScript中,操作`iframe`内的DOM元素是常见的需求,特别是在构建复杂的网页应用时。`iframe`(Inline Frame)是一种可以在HTML文档中嵌入另一个HTML文档的元素,它允许我们实现页面分隔、加载外部资源或者创建...

    jQuery获取iframe的document对象的方法

    这里,`#myframe`是`iframe`的ID,`prop('contentWindow')`返回的是`iframe`的窗口对象,而`window`对象在JavaScript中包含了`document`属性,所以通过`.document`可以获取到`iframe`内部的`document`对象。...

    JS 获取iframe高度的静动态方法

    在JavaScript(JS)中,获取iframe(内联框架)的高度是一项常见的需求,特别是在构建富互联网应用或嵌入第三方内容时。下面将详细讲解如何静态和动态地获取iframe的高度。 一、静态获取iframe高度 1. **DOM属性...

    iframe跨域通信解决方法

    - **全局Cross对象**:`crossUtils.js`中定义了一个全局对象`Cross`,其下有两个主要属性: - `signalHandler`:存储注册的信号及其对应的回调函数。 - `on`:用于注册一个信号及其回调函数。 - `call`:用于向...

    [导入]Javascript获取IFrame内容(兼容IE&FF)

    在JavaScript编程中,有时我们需要获取Iframe(内联框架)中的内容,这在处理嵌套页面、跨域通信或者实现动态加载时非常常见。本文将详细介绍如何在各种浏览器,包括Internet Explorer(IE)和Firefox(FF)等主流...

    iframe 跨域

    - postMessage和message事件:这是一种相对安全的跨域通信方式,允许窗口、`iframe`或Worker之间发送消息,接收方通过监听`message`事件获取数据。 4. 文件分析: - `index.html`:可能是主页面,包含一个`iframe...

    js获取iframe中的window对象的实现方法

    在处理跨域、模块化开发或者复杂交互时,我们可能需要获取到`iframe`内的`window`对象,以便与`iframe`内容进行通信或操作。`window`对象在JavaScript中代表一个浏览器窗口,它包含了全局变量、函数以及与用户交互...

    iframe跨域自适应高度模板

    一种常见的方法是在父页面中监听`iframe`的`load`事件,然后通过`contentWindow`属性获取到`iframe`内部的`window`对象,并通过`document`对象获取内容区域的高度。以下是一个简单的示例: ```javascript document....

    iframe跨域高度自适应例子源码

    这意味着我们不能直接在父页面中通过JavaScript获取`iframe`内容的高度。 为了解决这个问题,我们可以利用`postMessage`和`message`事件。`postMessage`是HTML5引入的一种通信方式,允许来自不同源的窗口进行通信。...

    js操作iframe的一些知识

    获取Iframe窗口对象是进行进一步操作的基础,可以通过以下方法获取: ```javascript // 使用frames数组 var ifr_window = window.frames["frameName"]; // 或者通过getElementById var iframeElement = document....

    layer弹窗:top.layer弹窗到父页面跨域解决办法

    标题和描述所提及的是一个关于如何解决layer弹窗在跨域环境下的问题,主要涉及到iframe、跨域以及layer的使用技巧。下面我们将详细探讨这个问题及其解决方案。 首先,我们了解下**iframe**。iframe(Inline Frame)...

    js获取IFRAME当前的URL的方法

    以下将详细介绍如何使用JavaScript获取IFRAME的当前URL。 首先,我们需要理解IFRAME的工作原理。IFRAME是一种HTML元素,它可以嵌入另一个HTML文档到当前页面中。IFRAME有自己的独立上下文,包括DOM树、JavaScript...

    原生js获取iframe中dom元素--父子页面相互获取对方dom元素的方法

    // 获取iframe内部页面的window对象 var iframeWindow = iframe.contentWindow; // 通过iframe内部页面的window对象获取内部DOM元素 var divInsideIframe = iframeWindow.document.getElementById('objId'); //...

    Jquery方式获取iframe页面中的 Dom元素

    然后,通过调用“.contents()”方法获取iframe的文档内容,这会返回iframe的Document对象。接着,使用“.find()”方法在该文档中查找具有特定id的元素,本例中是id为“test”的元素。 一旦选中了目标元素,就可以...

    获取iframe子网页的Height

    在Chrome、Firefox等现代浏览器中,可以通过JavaScript的`contentWindow`和`contentDocument`属性来访问`iframe`内的窗口对象和文档对象。例如: ```javascript var iframe = document.getElementById('iframeId');...

    iframe与主框架跨域相互访问

    它们可以共享JavaScript变量、通过DOM操作互相影响,以及使用`window.postMessage`进行通信。例如,主框架可以通过以下方式获取`iframe`中的DOM元素: ```javascript var iframeDoc = document.getElementById('...

    Iframe获取父页面的变量和控件

    本文将深入探讨如何通过 `Iframe` 获取父页面的变量和控件。 首先,我们要理解 `Iframe` 的基本概念。`Iframe` 是一个内联框架,它允许我们在一个HTML文档中嵌入另一个HTML文档,相当于在当前页面中打开一个新的...

Global site tag (gtag.js) - Google Analytics