javascript操作window对象
document.defaultView或全局变量window——获取一个window对象。
1）获取窗体信息
innerHeight、innerWidth——获取窗体内容区域的高度、宽度。
outerHeight、outerWidth——获取窗体的高度、宽度（包括边框和菜单条等）；
pageXOffset、pageYOffset——获取窗体从左上角算起水平/垂直滚动过的像素数；
screen——返回一个描写叙述屏幕的Screen对象；
screen.availHeight、screen.availWidth——屏幕上可供显示窗体部分的高度、宽度（排除工具栏和菜单条之外）；
screen.colorDepth——屏幕的颜色深度；
screen.height、screen.width——屏幕的高度、宽度；
screenLeft/screenX——获取从窗体左边缘到屏幕左边缘的像素（注意浏览器兼容性）。
screenTop/screenY——获取从窗体上边缘到屏幕上边缘的像素（注意浏览器兼容性）；
2）与窗体进行交互
blur()——让窗体失去键盘焦点；
close()——关闭窗体（不是全部浏览器都同意某个脚本关闭窗体）。
focus()——让窗体获得键盘焦点。
print()——提示用户打印页面；
scrollBy(<x>,<y>)——让文档相对于当前位置进行滚动。
scrollTo(<x>,<y>)——滚动到指定的位置。
stop()——停止加载文档。
3）对用户进行提示
alert(<msg>)——向用户提示一个对话框窗体并等候其被关闭；
confirm(<msg>)——显示一个带有确认和取消提示的对话框窗体（返回一个布尔值）；
prompt(<msg>,<val>)——显示对话框提示用户输入一个值（返回字符串）；
showModalDialog(<url>)——弹出一个窗体，显示指定的URL;
4)history对象的属性和方法
back()——在浏览历史中后退一步；
forward()——在浏览历史中前进一步；
go(<index>)——转到相对于当前文档的某个浏览历史位置。正值是前进，负值是后退；
length——返回浏览历史中的项目数量。
pushState(<state>,<title>,<url>)——向浏览器历史加入一个条目；
replaceState(<state>,<title>,<url>)——替换浏览器历史中的当前条目；
state——返回浏览器历史中关联当前文档的状态数据；
5）使用跨文档消息传递
postMessage(<msg>,<origin>)——给还有一文档发送指定的消息；
寻找内嵌的window:
defaultView——返回活动文档的window;
frames——返回文档内嵌iframe元素的window对象数组；
opener——返回打开当前浏览上下文环境的window。
parent——返回当前window的父window;
self——返回当前文档的window；
top——返回最上层的window；
length——返回文档内嵌的iframe元素数量；
[<index>]——返回指定索引位置内嵌文档的window。
[<name>]——返回指定名称内嵌文档的window；
6）使用计时器
setTimeout(<function>,<time>)——创建一个计时器，等待time毫秒后调用指定的函数；
clearTimeout(<id>)——撤销某个超时计时器。
setInterval(<function>,<time>)——创建一个计时器，每隔time毫秒调用指定的函数；
clearInterval(<id>)——撤销某个时间间隔计时器；
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<title>上海远地资产管理有限公司</title>
<meta name="author" content="jason"/>
<meta name="description" content="上海远地资产管理有限公司（简称：远地资产），是一家专业的互联网金融服务平台."/>
<link rel="shortcut icon" href="images/favicon.ico" type="image/x-icon"/>
<style>
table{
border-collapse: collapse;
border:thin solid black;
}
th,td{
padding: 4px;
}
</style>
</head>
<body>
<table border="1">
<tr>
<th>outerWidth:</th><td id="ow"></td><th>outerHeight:</th><td id="oh"></td>
</tr>
<tr>
<th>innerWidth:</th><td id="iw"></td><th>innerHeight:</th><td id="ih"></td>
</tr>
<tr>
<th>screen.width:</th><td id="sw"></td><th>screen.height:</th><td id="sh"></td>
</tr>
</table>
<p id="buttons1">
<button id="scroll">scroll</button>
<button id="print">print</button>
<button id="close">close</button>
</p>
<p id="buttons2">
<button id="alert">alert</button>
<button id="confirm">confirm</button>
<button id="prompt">prompt</button>
<button id="modal">modal dialog</button>
</p>
<p id="buttons3">
<button id="back">back</button>
<button id="forward">forward</button>
<button id="go">go</button>
</p>
<p id="buttons4">
<button id="banana">banana</button>
<button id="apple">apple</button>
</p>
<p id="msg"></p>
<p>
远地本着“构筑诚信，永续发展”的理念为客户提供专业的理財服务、財富管理以及产品方案推荐。 远地都进来看看撒将通过自身的专业优势和有效的信息交流平台，为资金富裕方和资金需求方打造一个专业，诚信，共赢。睿智的服务平台，
帮助客户实现稳定、安全的財富增值。帮助很多其它优秀的中小型企业融资成功。
<img id="sohu" class="img" name="xw" src="images/xw_sohu.png" alt="sohu"/>
远地本着“构筑诚信，永续发展”的理念为客户提供专业的理財服务、財富管理以及产品方案推荐。
远地都进来看看撒将通过自身的专业优势和有效的信息交流平台，为资金富裕方和资金需求方打造一个专业，诚信，共赢，睿智的服务平台，
帮助客户实现稳定、安全的財富增值。帮助很多其它优秀的中小型企业融资成功。 <img id="xw" class="img" src="images/xw_china.png" alt="新闻网图标"/>
远地本着“构筑诚信，永续发展”的理念为客户提供专业的理財服务、財富管理以及产品方案推荐。
远地都进来看看撒将通过自身的专业优势和有效的信息交流平台，为资金富裕方和资金需求方打造一个专业。诚信，共赢。睿智的服务平台，
帮助客户实现稳定、安全的財富增值。帮助很多其它优秀的中小型企业融资成功。 </p>
<p id="status">Ready</p>
<button id="send">Send Message</button>
<p>
<iframe name="nested" src="http://localhost:63342/IDEA-workspace/Demotest/otherdomain.html" width="90%" height="100px"></iframe>
</p>
<p id="msg2"></p>
<p id="buttons5">
<button id="settime">Set Time</button>
<button id="cleartime">Clear Time</button>
<button id="setinterval">Set Interval</button>
<button id="clearinterval">Clear Interval</button>
</p>
<script>
//获取窗体信息
document.getElementById("ow").innerHTML=window.outerWidth;
document.getElementById("oh").innerHTML=document.defaultView.outerHeight;
document.getElementById("iw").innerHTML=window.innerWidth;
document.getElementById("ih").innerHTML=window.innerHeight;
document.getElementById("sw").innerHTML=window.screen.width;
document.getElementById("sh").innerHTML=window.screen.height;
</script>
<script>
//与窗体进行交互
var buttons=document.getElementById("buttons1").getElementsByTagName("button");
for(var i=0;i<buttons.length;i++){
buttons[i].onclick=handleButtonPress;
}
function handleButtonPress(e){
if(e.target.id=="print"){
window.print();
}else if(e.target.id=="close"){
window.close();
}else{
window.scrollTo(0,800);
}
}
</script>
<script>
//对用户进行提示
var buttons2=document.getElementById("buttons2").getElementsByTagName("button");
for(var i=0;i<buttons2.length;i++){
buttons2[i].onclick=handleButtonPress2;
}
function handleButtonPress2(e){
if(e.target.id=="alert"){
window.alert("这是一个提示框");
}else if(e.target.id=="confirm"){
var confirmed=window.confirm("这是一个确认框，确定要继续？")
alert("确定吗？"+confirmed);
}else if(e.target.id=="prompt"){
var response=window.prompt("输入一个单词","hello");
alert("这个单词是："+response);
}else if(e.target.id=="modal"){
window.showModalDialog("http://www.sina.com.cn");
}
}
</script>
<script>
//在浏览历史中导航
var buttons3=document.getElementById("buttons3").getElementsByTagName("button");
for(var i=0;i<buttons3.length;i++){
buttons3[i].onclick=handleButtonPress3;
}
function handleButtonPress3(e){
if(e.target.id=="back"){
window.history.back();
}else if(e.target.id=="forward"){
window.history.forward();
}else if(e.target.id=="go"){
window.history.go("http://www.sina.com.cn");
}
}
</script>
<script>
//向浏览历史加入一个条目
var sel="no selection made";
if(window.location.search=="? banana"){
sel="Selection:Banana";
}else if(window.location=="?apple"){
sel="Selection:Apple";
}
document.getElementById("msg").innerHTML=sel;
var buttons4=document.getElementById("buttons4").getElementsByTagName("button");
for(var i=0;i<buttons4.length;i++){
buttons4[i].onclick=function(e){
document.getElementById("msg").innerHTML= e.target.innerHTML;
//window.history.pushState("","","otherdomain.html?"+ e.target.id);
//替换浏览器历史中的当前条目
window.history.replaceState("","","otherdomain.html? "+ e.target.id);
}
}
</script>
<script>
//跨文档问题
document.getElementById("send").onclick=function(){
//定位window对象并调用postMessage方法
window["nested"].postMessage("I like apples","http://localhost:63342");
document.getElementById("status").innerHTML="Message Sent";
} </script>
<script>
var buttons5=document.getElementById("buttons5").getElementsByTagName("button");
for(var i=0;i<buttons5.length;i++){
buttons5[i].onclick=handleButtonPress4;
}
var timeID;
var intervalID;
var count=0;
function handleButtonPress4(e){
if(e.target.id=="settime"){
timeID=setTimeout(function(){
displayMsg("Timeout Expired");
},5000);
displayMsg("Timeout set");
}else if(e.target.id=="cleartime"){
clearTimeout(timeID);
displayMsg("Timeout cleared");
}else if(e.target.id=="setinterval"){
intervalID=setInterval(function(){
displayMsg("Interval Expired. Counter:"+count++);
},2000);
displayMsg("Interval set");
}else if(e.target.id=="clearinterval"){
clearInterval(intervalID);
displayMsg("Interval cleared");
}
}
function displayMsg(msg){
document.getElementById("msg2").innerHTML=msg;
}
</script>
</body>
</html>
otherPage代码：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Other Page</title>
</head>
<body>
<h1 id="banner">This is the nested document</h1>
<script>
//监听message事件
window.addEventListener("message",receiveMessage,false);
function receiveMessage(e){
if(e.origin=="http://localhost:63342"){
displayMessage(e.data);
}else{
displayMessage("message discarded");
}
}
function displayMessage(msg){
document.getElementById("banner").innerHTML=msg;
}
</script> </body>
</html>
javascript操作window对象的更多相关文章
- javaScript操作DOM对象（看三遍，敲三遍，写三遍！ 不会你找我）！！
DOM是Document Object Model的缩写,即文档对象模型,是基于文档编程的一套API 使用javaScript操作DOM对象通常分为三类:1.DOM CORE 2.HTM ...
- 第三章 JavaScript操作BOM对象
第三章 JavaScript操作BOM对象 一.window对象 浏览器对象模型(BOM)是javascript的组成之一,它提供了独立与浏览器窗口进行交换的对象,使用浏览器对象模型可以实现与HT ...
- 在Javascript操作JSON对象，增加 删除 修改
在Javascript操作JSON对象,增加删除修改全有的,详情见代码 <script type="text/javascript"> var jsonObj2 = { ...
- 第四章 JavaScript操作DOM对象
第四章 JavaScript操作DOM对象 一.DOM操作 DOM是Document Object Model的缩写,即文档对象模型,是基于文档编程的一套API接口,1988年,W3C发布了第一级 ...
- JavaScript: 高级技巧: window 对象也可以添加自定义属性
JavaScript: 高级技巧: window 对象也可以添加自定义属性 例如 window.ntName = 'a';例如 window.ntXw = top; 优点是, window 无须等加载 ...
- javascript中window对象 部分操作
<!--引用javascript外部脚本--> <script src="ss.js"></script> <script> //警 ...
- javascript之window对象
window :window对象是BOM中所有对象的核心,除了是BOM中所有对象的父对象外,还包含一些窗口控制函数. 1.全局的window对象 JavaScript中的任何一个全局函数或变量都是wi ...
- JavaScript操作BOM对象
1)windows对象 浏览器对象模型(BOM :Browser Object Model)是JavaScript的组成之一,它提供了独立于内容与浏览 器窗口进行交互的对象,使用浏览器对象模型可以 ...
- JQuery制作网页—— 第二章 JavaScript操作BOM对象
1.window对象: 浏览器对象模型(BOM)是javascript的组成之一, 它提供了独立与浏览器窗口进行交换的对象,使用浏览器对象模型可以实现与HTML的交互. 它的作用是将相关的元素组织包装 ...
随机推荐
- 日积（Running）月累（ZSSURE）：Task之Cancel、OpenAccess之Delete及fo-dicom之DeepCopy、
题记: 最近看了一篇关于架构方面的良心长文你的架构是怎样一步步腐化的?,文中字字句句道出了诸多从业者.初创企业,以及BAT都会遇到的问题,细细品读后认为工作生活中的诸多情况皆如此,都会有一个体量由小到 ...
- luogu3366 【模板】 最小生成树 Prim
题目大意 给出一个无向图,求出最小生成树,如果该图不连通,则输出orz. 概念 对于一个无向图,要求选出一些边,使得图上的每一个节点互相连通,且边权和最小.选出的边与节点形成的子图必然是颗树,这棵树叫 ...
- JS垃圾回收——和其他语言一样，JavaScript 的 GC 策略也无法避免一个问题：GC 时，停止响应其他操作，这是为了安全考虑
JavaScript 内存管理 & 垃圾回收机制 标记清除 js 中最常用的垃圾回收方式就是标记清除.当变量进入环境时,例如,在函数中声明一个变量,就将这个而变量标记为“进入环境”.从逻辑上讲 ...
- 利用python开发的flappy bird 游戏
python 中 pygame模块能让我们很方便的编写游戏,16年我用python 仿制了flappy bird 游戏,下面是游戏的完整代码以及素材,分享给大家. 第一个python文件,flappy ...
- python之路——迭代器和生成器
阅读目录 楔子 python中的for循环 可迭代协议 迭代器协议 为什么要有for循环 初识生成器 生成器函数 列表推导式和生成器表达式 本章小结 生成器相关的面试题 返回顶部 楔子 假如我现在有一 ...
- Arduino-1602-LiquidCrystal库
前言:LiquidCrystal是一个1602的IIC库,使用IIC协议可以极大节约用线数量,十分方便.当然,前提是1602要使用LCD1602 I2C模块. 一.库函数快速查询 LiquidCrys ...
- QlikSense系列(2)——QlikSense安装和升级
继上篇对QlikSense进行总体介绍之后,想必大家想体验下产品,下面介绍安装的过程和注意点. 注:我的系统环境Windows Server 2008R2,QlikSense版本为3.1SR1 Qli ...
- vue-cli 安装
1 node 下载 http://nodejs.cn/download/ 安装 2 npm install vue-cli -g 3 vue init <template-n ...
- SQLServer 事务的隔离级别
SQLServer事务的隔离级别 数据库是要被广大客户所共享访问的,那么在数据库操作过程中很可能出现以下几种不确定情况. 更新丢失(Lost update) 两个事务都同时更新一行数据,但是第二个事务 ...
- Spring DATA MongoDB @DBref查询，or和and联合查询
@DBref文档关联,在按该类型查询的时候,在字段名后加上关联表的字段名即可,如: Criteria.where("bloggroup.$id"), $id代表关联表的oid字段. ...