用一个简单的例子来描述该问题:
A.jsp页面中:
<iframe id="a_frame" src="B.jsp" frameborder="0" scrolling="no" >
</iframe>
B.jsp页面中:
<div id="b_div" >
<table cellpadding="0" cellspacing="0" width="96%">
<tr>
<td align="left">指派班组负责人</td>
</tr>
</table>
</div>
现在需要在A页面中修改用iframe嵌入的B.jsp页面中的div的位置。
实现方法如下:
用document.frames("a_frame").document.getElementById("b_div")可以获得b_div元素,然后通过样式修改其位置就可以了。
注意:但存在一个问题,就是在a_frame页面未加载完成时,用上面的语句获得的值是null。所以要加入一行判断iframe已经完全加载的语句。
document.frames("a_frame").onreadystatechange=function()
{
if(this.readyState=="complete")
{
document.frames("a_frame"). document.getElementById("b_div");
}
}
分享到:
相关推荐
在Web开发中,"父窗口调用iframe子窗口方法"是一个常见的交互场景,尤其是在构建复杂的单页面应用或者需要跨窗口通信时。这篇文章将详细讲解如何实现这个功能,并提供相关的源码示例。 首先,理解基本概念。`iframe...
然而,在使用iframe时,经常会遇到一个问题:如何在iframe中访问父窗口的元素,或者在父窗口中访问iframe中的元素?本文将对jquery和js调用iframe父窗口与子窗口元素的方法进行整理。 1. jquery在iframe子页面获取...
首先,需要明确iframe元素可以被视为一个小型的浏览器窗口,它有自己的文档对象模型(DOM)。要与iframe中的DOM交互,需要通过iframe的window属性来访问。iframe的window属性实际上指向的是iframe内容的window对象。...
以下将详细介绍如何在HTML中进行`<iframe>`父窗口与子窗口之间的交互操作。 首先,我们来看一些通用的方法: 1. **获取子窗口的值**: 使用`document.frames`对象(在IE中)或`contentDocument`属性(在非IE浏览...
3. **父窗口访问子窗口**: - 使用`window.frames['iframeName']`或`window.frames[0]`(如果只有一个iframe)可以访问子窗口的window对象。 - 例如,要修改子窗口的标题,可以执行`window.frames['iframeName']....
这一过程利用了JavaScript中的window.parent对象,它是iframe元素与父窗口之间的桥梁。 首先,理解window对象在JavaScript中的地位非常关键。window对象代表了浏览器中的一个窗口或一个标签页,它包含有关窗口的...
当我们需要在iframe子页面中访问父页面的元素时,可以使用jQuery的`parent.document`来引用父窗口的文档对象。例如,如果我们要获取父页面中ID为"objid"的元素,代码如下: ```javascript $("#objid", parent....
- **使用 jQuery**:在 iframe 中,你可以用相同的逻辑来选取父窗口中的元素,如 `$(window.parent.document).find(":text")` 选取父窗口中的所有文本输入框。 3. **具体操作示例** - **选中单选按钮**:在父...
本文将深入探讨在`iframe`中生成父窗口元素以及如何在`iframe`内触发父窗口的事件,特别是针对IE和Firefox的差异。 首先,让我们了解`iframe`的基本用法。`iframe`通过`src`属性指定要加载的HTML文档,例如: ```...
在父窗口中访问子窗口(即`iframe`内的文档)通常需要使用`window.frames`或`document.getElementById`方法。下面介绍两种主要的方法: **方法一:** ```javascript // 使用window.frames获取iframe中的元素 ...
在iframe子页面中,可以通过`window.parent`对象访问父窗口,进而获取或操作父页面的DOM元素。 #### 使用纯JavaScript访问父页面元素 使用纯JavaScript,可以通过`window.parent.document.getElementById`方法来...
总结来说,“子页面访问父页面”和“跨iframe访问”是Web开发中的关键技能,它们允许在不同层次或域的页面间进行数据传递和控制交互。理解和掌握这些技术对于构建动态、交互性强的网页至关重要。通过阅读提供的博客...
2. **覆盖`window.parent`对象**:在父窗口中,我们可以创建一个同名的`window.parent`对象,使得`iframe`内的脚本无法访问到真实的父窗口对象。 ```javascript window.parent = new Object(); // 或者 window....
这段代码首先通过`getElementById`获取`iframe`元素,然后通过`contentWindow`属性访问到`iframe`内部的页面,再用`querySelector`找到图片元素,并设置其宽高为父窗口的宽高。 为了实现动态响应,我们需要监听窗口...
- 当元素在iframeA中拖动时,通过`window.parent.postMessage`将元素的新位置信息发送到父窗口。 - 在父窗口中,监听`message`事件,接收到消息后判断是否需要将信息传递给另一个iframeB。 - 如果需要,父窗口...
在DHTML手册中,可能包含了如何使用JavaScript操纵DOM元素来实现子窗口与父窗口通信的方法。 3. **IFrame通信:** - 当子窗口是页面内的IFrame时,可以通过`window.parent`访问父窗口的对象,反之亦然,只要同源...
当我们需要在Iframe中操作或访问父窗口中的元素时,就会涉及到跨域安全问题以及DOM(Document Object Model)的交互。 本示例中,我们有一个包含表单的主页面,表单名为`frm`,其中有一个输入框`BH`。Iframe中加载...
例如,可以通过document.frames['frameName']或者document.getElementById('frameId')获取iframe元素,然后可以修改其location属性,从而在指定的iframe中加载新的URL。例如:document.frames['frameName'].location...
- **操作父窗口中的iframe元素**:`$("#iframeId", window.parent.document)`这种选择器可以选中父窗口中id为`iframeId`的iframe元素。 - **在父窗口中操作iframe中的元素**:如果在父窗口中操作iframe内的元素,...
而在父页面中,由于`iframe`内容被封装在一个单独的窗口对象中,我们需要先获取到`iframe`的`contentWindow`或`contentDocument`属性,然后才能访问`iframe`中的内容。例如,获取`iframe`内一个名为`iframeFunction`...