从父页面读取和操作iframe中内容方法


Posted in Javascript onJuly 25, 2009

基本的操作方法:
document.frames("frame_id").document.action;
其中,frame_id是该父页面需要进行操作的iframe的id,action是iframe中的相关操作。
从该方法中,可以看出 document.frames("frame_id")是用来从父页面中获取iframe的id的,而后面的document.action同一般的脚本对页面元素操作一样,具体举个例子来说明一下,其中父页面引用iframe部分如下:

<div id="region1" name="region1"> 
<iframe onload="iframe_test()" frameborder="0" scrolling="no" width="100%" height="500" name="test_iframe" id="test_iframe" src="/testIframe.jsp" src="testIframe.jsp"></iframe> 
</div>

testIframe.jsp如下:
<%@ page language= "java" contentType="text/html; charset=utf-8" pageEncoding="utf-8"%> 
<html> 
<head> 
<title>test_iframe</title> 
</head> 
<body> 
<table class="data_form" align="center"> 
<tr> 
<th>testname</th> 
<td><input name="testname" type="text" id="testname" value="testname" ></td> 
</tr> 
<tr> 
<th>description</th> 
<td><input name="decription" type="text" id="decription" value="testname" /></td> 
</tr> 
</table> 
<br> 
<div > 
<input name="fs" type="submit" id="fs" value="test" onClick="alert('test');" class="button"> 
</div> 
</body> 
</html>

父页面中对iframe元素操作的script脚本如下:
<script type="text/javascript"><!-- 
function iframe_test(){ 
if (document.frames("test_iframe").document.getElementById("testname").value=="testname") 
{ 
alert("test successful!"); 
} 
if(document.frames("test_iframe").document.getElementById("decription").value=="") 
{ 
document.frames("test_iframe").document.getElementById("decription").value="description" 
} 
} 
// --></script>

此例描述了在父页面中读取iframe中元素以及在父页面中修改iframe中元素的属性。

通过此例,我们可以看出,在父页面中访问iframe中的各个元素与一般的访问页面元素无本质区别,无非是需要在父页面中事先获取需要处理的iframe对象,在获取iframe对象后,其操作基本没什么特别之处。

Javascript 相关文章推荐
使javascript也能包含文件
Oct 26 Javascript
图片上传判断及预览脚本的效果实例
Aug 07 Javascript
在页面中js获取光标/鼠标的坐标及光标的像素坐标
Nov 11 Javascript
javascript常用经典算法实例详解
Nov 25 Javascript
浅析JavaScript中命名空间namespace模式
Jun 22 Javascript
Google Maps基础及实例解析
Aug 06 Javascript
jQuery flip插件实现的翻牌效果示例【附demo源码下载】
Sep 20 Javascript
Webpack 服务器端代码打包的示例代码
Sep 19 Javascript
基于vue v-for 多层循环嵌套获取行数的方法
Sep 26 Javascript
微信小程序使用map组件实现检索(定位位置)周边的POI功能示例
Jan 23 Javascript
echarts多条折线图动态分层的实现方法
May 24 Javascript
jquery将json转为数据字典的实例代码
Oct 11 jQuery
javaScript 数值型和字符串型之间的转换
Jul 25 #Javascript
JavaScript中null与undefined分析
Jul 25 #Javascript
js 字符串操作函数
Jul 25 #Javascript
javaScript Array(数组)相关方法简述
Jul 25 #Javascript
对象特征检测法判断浏览器对javascript对象的支持
Jul 25 #Javascript
javascript 一个函数对同一元素的多个事件响应
Jul 25 #Javascript
IE中radio 或checkbox的checked属性初始状态下不能选中显示问题
Jul 25 #Javascript
You might like
析构函数与php的垃圾回收机制详解
2013/10/28 PHP
详解php用curl调用接口方法,get和post两种方式
2017/01/13 PHP
thinkPHP5.0框架模块设计详解
2017/03/18 PHP
php+jQuery ajax实现的实时刷新显示数据功能示例
2019/09/12 PHP
TP - 比RBAC更好的权限认证方式(Auth类认证)
2021/03/09 PHP
setTimeout 不断吐食CPU的问题分析
2009/04/01 Javascript
JavaScript 学习笔记(六)
2009/12/31 Javascript
ASP.NET jQuery 实例17 通过使用jQuery validation插件校验ListBox
2012/02/03 Javascript
javascript学习笔记(十三) js闭包介绍(转)
2012/06/20 Javascript
jQuery筛选器children()案例详解(图文)
2013/02/17 Javascript
jquery进行数组遍历如何跳出当前的each循环
2014/06/05 Javascript
基于nodejs+express(4.x+)实现文件上传功能
2015/11/23 NodeJs
jQuery简单操作cookie的插件实例
2016/01/13 Javascript
分享我对JS插件开发的一些感想和心得
2016/02/04 Javascript
Bootstrap3学习笔记(三)之表格
2016/05/20 Javascript
JavaScript中访问id对象 属性的方式访问属性(实例代码)
2016/10/28 Javascript
详解webpack解惑:require的五种用法
2017/06/09 Javascript
js中对象和面向对象与Json介绍
2019/01/21 Javascript
Node.js安装详细步骤教程(Windows版)详解
2019/09/01 Javascript
jQuery实现聊天对话框
2020/02/08 jQuery
Vue实现背景更换颜色操作
2020/07/17 Javascript
[27:08]完美世界DOTA2联赛PWL S2 SZ vs Rebirth 第二场 11.21
2020/11/23 DOTA
Python 3中的yield from语法详解
2017/01/18 Python
Python分析学校四六级过关情况
2017/11/22 Python
Django实现CAS+OAuth2的方法示例
2019/10/30 Python
selenium+python配置chrome浏览器的选项的实现
2020/03/18 Python
Python正则re模块使用步骤及原理解析
2020/08/18 Python
Draper James官网:知名演员瑞茜·威瑟斯彭所创品牌
2017/10/25 全球购物
expedia比利时:预订航班+酒店并省钱
2018/07/13 全球购物
东方通信股份有限公司VC面试题
2014/08/27 面试题
店长助理岗位职责
2013/12/13 职场文书
追悼会悼词大全
2015/06/23 职场文书
解决mysql问题:由于找不到MSVCR120.dll,无法继续执行代码
2021/06/26 MySQL
浅谈PostgreSQL表分区的三种方式
2021/06/29 PostgreSQL
Python torch.flatten()函数案例详解
2021/08/30 Python
CSS实现九宫格布局(自适应)的示例代码
2022/02/12 HTML / CSS