易截截图软件、单文件、免安装、纯绿色、仅160KB

用javascript访问操作iframe里的dom

 
很多人一直都有个想法,要是可以随心所欲的操作iframe就好了。这样静态页面也就有了相当于后台动态页面php,jsp,asp中include,require实现统一多页面布局的能力。
通过Javascript的帮忙我们可以像后台一样动态加载操作iframe对象属性src指向的html页面的内容。这样的操作需要提供两个页面,一个页面是iframe所在页面(页面名称:iPage.html),另一个页面是iframe属性src指向页面(页面名称:srcPage.html)。
iPage.html,<body>里dom:
<iframe id=“iId“ name=“iName“ src=“srcPage.html“ scrolling=“no“ frameborder=“0“></iframe>
srcPage.html,<body>里dom:
<h1>妹妹的一天</h1> 
<p>早上吃早点,中午约会吃饭,下午K歌,晚上和哥哥瞎折腾</p>
下面讨论ie下JS是怎么操作以上两个页面,再讨论firefox的做法,最后给出兼容ie,firefox浏览器操作iframe对象的方法。
一、ie下访问操作iframe里内容
大家都知道iframe是非标准html标签,它是由ie浏览器推出的多布局标签, 随后Mozilla也支持了这个标签。(闲话,嘿嘿)
1. ie通过document.frames["IframeName"]获取它,例子:我们在iPage.html里输出srcPage.html里h1的内容,JS如下:
alert(document.frames["iName"].document.getElementsByTagName(‘h1‘)[0].firstChild.data);
你会发现这样在页面里加入代码,好像并没有输出想要的东东,为什么呢?这个我也没有搞清楚,只是习惯性的加入了window.onload就有输出了(注:JS代码都写到这个事件里去),知道的人士可否告诉我下。why?更改之后代码ie下有了输出,firefox下document.frames没有定义错误提示:
window.onload = (function () { 
  alert(document.frames["iName"].document.getElementsByTagName(‘h1‘)[0].firstChild.data);
});
2. ie另一种方法contentWindow获取它,代码:
window.onload = (function () { 
 var iObj = document.getElementById(‘iId‘).contentWindow;
 alert(iObj.document.getElementsByTagName(‘h1‘)[0].firstChild.data);
});
此方法经过ie6,ie7,firefox2.0,firefox3.0测试都通过,好事啊!嘿嘿。(网上一查,发现Mozilla Firefox iframe.contentWindow.focus缓冲区溢出漏洞,


相关文档:

Javascript之浏览器对象


浏览器对象
 
 
浏览器对象就是网页和浏览器本身各种实体元素在JavaScript程序中的体现。这样的浏览器对象主要包括以下几个
●  Navigator:管理者当前使用浏览器的版本号、运行的平台以及浏览器使用的语言等信息。
●  Windows对象:处于整个从属表的最顶级位置。每一个这样的对象代表一个浏览 ......

一个CSS+JavaScript编写的跑马灯程序

转自:
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>图片跑马灯</title>
</head>
<body>
<div style="overflow:hidden; width:350px" id='div'>
<!-- 这里是第一个关键点,o ......

实用的 JavaScript 测试及效验工具

JavaScript 是一款强大的广泛运用于现代Web站点及应用的脚本语言。作为一个技艺精湛的 Web 开发者,掌握JavaScript可以增强用户的使用体验,提供交互及富客户端等功能。
尽管JavaScript 的语法非常简单,但对于写程序而言仍然是困难重重,就是因为它的运行环境:基于Web浏览器。
以下您可以看到收集的8个实用的 JavaScrip ......

javascript操作复选框函数

javascript操作复选框函数
function CheckAll(form) {//全选
for (var i=0;i    var e = form.elements[i];
    if (e.name != 'chkall')
       e.checked = form.chkall.checked;
   }
}
function checkSelect()//判断是否有选 ......

深入认识javascript中的eval函数

深入认识javascript中的eval函数
分类:技术专区时间:2007-5-21 15:04:58作者:supNate  
         发现为本文起一个合适的标题还不是那么容易,呵呵,所以在此先说明下本文的两个目的:
(1)介绍javascript中的eval函数的用法
(2)如何在函数内执行全局代码
► ......
© 2009 ej38.com All Rights Reserved. 关于E健网联系我们 | 站点地图 | 赣ICP备09004571号