JavaScript: top对象
一般的JS书里都会在讲框架集的时候讲top,这会让人误解,认为top对象只是代表框架集,其实top的含义应该是说浏览器直接包含的那一个页面对象,也就是说如果你有一个页面被其他页面以iframe的方式包含了,无论包含的层级是什么,都可以用top访问最外层的哪一个页面,因为这个页面被浏览器直接包含,这个事情的意义在于如果多个页面被同时加载,他们之间需要通信,就完全可以在最外层的页面设置一个通信对象,其他页面都通过这个对象进行通信(需要说明的是,如果要这么干,需要将他们部署在服务器上进行测试,仅仅在文件系统上测试,可能因为跨域而测试失败)
测试:
chorme浏览器,apache2服务器,原生js, index.html包含a.html; a.html包含b.html, b.html包含c.html; c.html通过top对象访问index.html定义的函数以及页面元素
index.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>iframe</title>
</head>
<body>
index.html
<div id="panel"></div>
<iframe src="a.html"></iframe>
<script language="javascript">
function showMessage()
{
alert("hello")
} o = new Object();
o.showMessage = showMessage;
</script>
</body>
</html>
c.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>iframe</title>
</head>
<body>
c.html
<input type="button" value="click me" onclick="show()" ></input>
<script language="javascript">
function show()
{
window.top.o.showMessage();
} </script>
</body>
</html>
top对象是window对象的子对象,如果要访问页面元素,可以这样写:
function show()
{
o = window.top.document.getElementById("panel");
o.innerHTML = "hello";
}
JavaScript: top对象的更多相关文章
- JavaScript的对象/下
JavaScript的对象 一.BOM对象 BOM----browser object model 1.window对象 所有浏览器都支持window对象. 概念上讲,一个html文档对应一个wind ...
- JavaScript DOM 对象
JavaScript DOM 对象 什么叫DOM,DOM是文档对象模型(Document Object Model,是基于浏览器编程(在本教程中,可以说就是DHTML编程)的一套API接口,W3C ...
- 前端基础:JavaScript DOM对象
JavaScript DOM对象 通过HTML DOM,可以访问JavaScript HTML文档的所有元素. 一.HTML DOM(文档对象模型) 当网页被加载时,浏览器会创建页面的文档对象模型(D ...
- web前端学习(四)JavaScript学习笔记部分(8)-- JavaScript 浏览器对象
1.window对象 1.1.window对象: window对象是BOM的核心,window对象指当前的浏览器窗口 所有javaScript全局对象.函数以及变量均自动生成为window对象的成员 ...
- javascript 全局对象--w3school
JavaScript全局对象 1. decodeURI()解析某个编码的URI. 2.decodeURInComponent()解析一个编码的URI组件. 3.encodeURI()把字符串编码为U ...
- JavaScript Json对象和Json对象字符串的关系 jsonObj<->JsonString
JavaScript Json对象和Json对象字符串的关系 jsonObj<->JsonString 如下示例: 直接写的a1就是一个Json对象,a2 就是一个Json对象字符串; 通 ...
- 从零构建JavaScript的对象系统
一.正统的类与继承 类是对象的定义,而对象是类的实例(Instance).类不可直接使用,要想使用就必须在内存上生成该类的副本,这个副本就是对象. 以Java为例: public class Grou ...
- 关于javascript自定义对象(来自网络)(最近几天不会的)
javascript定义对象的几种简单方法 1.构造函数方式,全部属性及对象的方法都放在构造方法里面定义 优点:动态的传递参数 缺点:每创建一个对象就会创建相同的方法函数对象,占用大量内存 funct ...
- 据说每个大牛、小牛都应该有自己的库——JavaScript原生对象拓展
在据说每个大牛.小牛都应该有自己的库——框架篇中我扬言要做个小牛,没想到一天没更新,小伙儿伴们就戏谑的问我,油哥是不是要太监了?其实事情是这个样子的,这不是太监的节奏,一是,关于写个自己的库的想法由来 ...
随机推荐
- NekoHTML and Dom4j
http://pro.ctlok.com/2010/07/java-read-html-dom4j-nekohtml.html package com.ctlok.pro; import java.i ...
- [转载]删除所有的.svn文件夹
Windows 下,在DOS窗口中运行如下命令 dos 代码 for /r <你项目的路径> %i in (.svn) do rd /s /q %i Linux 下,可以先运行 显示出当前 ...
- 简单实体Json序列化(输出JSON的属性可变)
简单实体Json序列化(输出JSON的属性可变) 一.先看效果 可以看出 , 我们在序列化一个对像时, 只给出了 我们想要 输出的两个字段名, 实际实体有5个属性, 经过可变属性序列化后的JSON ...
- Jquery 获取checkbox的checked问题
这个郁闷了,今天写这个功能的时候发现了问题,上网找了好多资料对照,更加纠结... 事实证明一切,自己测试了N遍,发现网上的说法和自己以前的理解都是错的,不知道大家有没发现. 下面来看看网上大多资料的说 ...
- WEB前端优化一些经验技巧
引言: 1. 慢的页面可能会网站失去更多的用户. 2. 慢500ms意味着20%的用户将放弃访问(google) 3. 慢100ms意味着1%的用户将放弃交易(amazon) 前段时间偶然看到网上的两 ...
- 如何让Div层悬浮在Flash Object对象之上(转载)
今天有个用户,门户右上角的倒三角登陆小按钮在他的电脑上无法显示,他用的笔记本屏幕较小,宽度正好显示出页面内容,经查看,门户页眉使用的为flash对象. 大家都知道,如果想让某个图片或者Div层悬浮在别 ...
- Android M Developer Preview - API Preview(一)
API Overview The M Developer Preview gives you an advance look at the upcoming release for the Andro ...
- 新建的linux虚拟机找不到eth0解决办法
新建的linux虚拟机通过 vi /etc/sysconfig/network-scripts/ifcfg-eth0进行配置: 再用ifconfig查看ip竟然没有eth0,只有lo和virbr0 其 ...
- 对象创建型模式------Abstract Factory(抽象工厂)
1. 意图 提供一个创建一系列相关或相互依赖对象的接口,而无需指定它们具体的类.2. 别名 Kit3. 动机 假设我们要开发一款游戏,当然为了吸引更多的人玩,游戏难度不能太大 ...
- smarty半小时快速上手入门教程
http://www.jb51.net/article/56754.htm http://www.yiibai.com/smarty/smarty_functions.html http://www. ...