第14章、window对象
1、计时器
I-1 setTimeout()和setInterval()可在指定时间后调用
setTimeout()返回值可传递给clearTimeout()用于取消该函数的执行。
多久后执行。
setInterval()指定时间间隔里重复调用（每隔多久执行）
例：计时器
/*
*安排函数f()在未来的调用模式
*在若干毫秒后调用f()
*如果设置了interval并没有设置end参数，则对f()调用将不会停止
*只有指定了f()，才会从start=0的时刻开始
*调用invoke()不会阻塞，它会立即返回
*/
function invoke(f,start,interval,end){
if(!start) start=0;
if(arguments.length<=2)
setTimeout(f,start);
else{
setTimeout(repeat,start);
function repeat(){
var h = setInterval(f,interval); //循环调用f()
//在end毫秒后停止调用，前提是end已经定义了
if(end) setTimeout(function(){clearInterval(h);},end);
}
}
}
若参数f不是函数而是字符串，那么这个字符串会在指定时间后进行求值（相当于eval()）
2、浏览器定位和导航
I-1 Window对象的location属性引用的是Location对象，Document对象的location属性也引用到Location对象。
window.location ===document.location;//总是返回true
显示文档的URL，并定义了方法来使窗口载入新的文档。
Document对象的URL属性
document.URL属性不会对定位到文档中的片段标识符做相应的更新，Location对象会。
I-2 解析URL
Location对象，表示该窗口中当前显示的文档的URL
Location对象的href属性是一个字符串，包含URL的完整文本
Location对象的toString()返回href属性的值，所以隐式调用时可用
location代替location.href。
另外，这个对象的其他属性（URL分解属性）：
protocol,host,hostname,port,pathname和search,分别表示URL的各个部分
同时被Link对象支持。
Location对象的hash和search属性：
hash属性返回URL中的"片段标识符"部分。
search属性返回的是问号之后的URL。用来参数化URL并在其中嵌入参数。
例：urlArgs()函数，提取URL的搜索字符串中的参数
/*这个函数用来解析来自URL的查询串中的name=value参数对
*它将name=value对存储在一个对象属性中，并返回该对象
*
*var args = urlArgs();
*var q = args.q||"";
*var n = args.n?parseInt(args.n):10;
*/
function urlArgs(){
var args = {};
var query = location.search.substring(1); //查找到查询串，并去掉'?'
var pairs = query.split("&"); //根据&符号将查询串隔开
for(var i =0;i<pairs.length;i++){
var pos = pairs[i].indexOf('=');//查找"name=value"
if(pos==-1) continue; //没有就跳过
var name =pairs[i].substring(0,pos);//提取name
var value =pairs[i].substring(pos+1);//提取value
value = decodeURIComponent(value);//对value进行解码
args[name] = value; //存储为属性
}
return args; //返回解析后的参数
}
I-3 载入新的文档
Location对象的assign()和replace()方法
//如果浏览器不支持XMLHttpRequest对象
//则将其重定向到一个不需要Ajax页面的静态页面
if(!XMLHttpRequest) location.replace("staticpage.html");
Location对象的reload()方法，让浏览器重新载入当前文档。
跳转新页面可直接把URL赋给location属性：
location = "http://www.baidu.com";
还可把相对URL副歌location，相对当前URL进行解析：
location = "page2.html";
片段标识符（相对URL的一种），滚动到文档的某个位置 "#top"查找ID为top的元素，
没有就跳到文档顶部：
location ="#top";
改变hash属性，则在当前文档中进行跳转
location.search = "?page="+(pagenum+1); //载入下一个页面
3、浏览历史
I-1 Window对象的history属性引用的是该窗口的History对象。
length属性表示浏览历史列表的元素数量。
History对象的back()和forward()方法与浏览器的后腿和前进按钮一样。
可使浏览器在浏览历史中前后跳转一格。
go()接受一个整数参数，正整数(向前)，负整数(向后跳过任意多个页)
history.go(-2);//相当于单击后退两次
4、浏览器和屏幕信息
navigator和screen属性（引用Navigator和Screen对象）
I-1 Navigator对象 使用其四个属性可用于浏览器嗅探
appName Web浏览器全称，如IE:"Microsoft Internet Explorer",Firefox及其他通常是"Netscape",网景浏览器
appVersion 浏览器版本信息和厂商
userAgent 浏览器在它的USER-AGENT HTTP头部中发生的字符串。通常包含appVersion中的所有信息
platform 在其上运行浏览器的操作系统(并且可能是硬件)的字符串
另
onLine 表示浏览器当前是否连接到网络。
geolocation Geolocation对象定义用于确定用户地理位置信息的接口。
javaEnabled() 非标准方法，判断浏览器是否可以运行java小程序。
cookieEnabled() 是否可以保存永久的cookie。
I-2 Screen对象 提供有关窗口显示大小和可用的颜色数量的信息
属性width和height指定以像素为单位的窗口大小。
属性availWidth和availHeight指定实际可用的显示大小。
属性colorDepth指定显示的BPP(bits-per-pixel)值，典型的值有16、24和32
可用来确定web应用是否运行在一个小屏幕的设备上。如果屏幕有限可选择更小的字体和图片等。
5、对话框
I-1 三个方法显示
alert() 显示消息并等待关闭
confirm() 显示消息并要求点击确定或取消
prompt() 显示消息，等待用户输入字符信息，并返回字符串。
do{
var name = prompt(What is your name?);
var correct = confirm("you entered '"+name+"'.\n"+
"Click Okay to proceed or Cancel to re-enter.");
}while(!correct)
alert("Hello,"+name);
方法confirm()和prompt()都会产生阻塞。alert()大多数浏览器上会。
以上都显示纯文本。
showModalDialog() 显示包含HTML格式的"模态对话框"：显示后就不能点选位于其下面的对话框。
例：使用showModalDialog()的HTML文件
<!--
var p = showModalDialog("multiprompt.html",["Enter 3D point coordinates","x","y","z"],
"dialogwidth:400;dialogheight:300;resizable:yes");
-->
<form>
<fieldset id="fields"></fieldset><!--对话框的正文部分-->
<div style="text-align:center"> <!--关闭对话框的按钮-->
<button onclick="okay()">Okay</button> <!--设置返回值和关闭事件-->
<button onclick="cancel()">Cancel</button><!--关闭时不带返回值-->
</div>
<script>
//创建对话框的主体部分，并在fieldset中显示出来
var args = dialogArguments;
var text = "<legend>"+args[0]+"</legend>";
for(var i=1;i<args.length;i++)
text += "<label>"+args[i]+":<input id='f"+i+"></label><br>";
document.getElementById("fields").innerHTML=text;
//直接关闭这个对话框，不设置返回值
function cancel(){window.close();}
//读取输入框的值，然后设置一个返回值，之后关闭
function okay(){
window.returnValue = [];
for(var i=1;i<args.length;i++)
window.returnValue[i-1] =document.getElementById("f"+i).value;
window.close();
}
</script>
</form>
6、错误处理
I-1 onerror属性（事件处理程序）传入三个字符串参数
参数1，错误信息的描述
参数2，发生错误的文档的URL
参数3，文档中发生错误的行数
window.onerror = function(msg,url,line){
if(onerror.num++<onerror.max){
alert("ERROR:"+msg+"\n"+url+":"+line);
return true;
}
}
onerror.max=3;
onerror.num=0;
7、Window对象属性的文档元素(作为全局变量)
id 不能定义为window对象已占有的属性名（history、location、navigation）。
若文档中包含一个id为"x"的元素（已是全局的了），并且还在代码中声明并赋值给全局变量x，那么显式声明的变量
会隐藏隐式的元素变量。
若声明的同名变量在元素之前，则会阻止元素获取window属性，在元素之后则会覆盖该属性的隐式值。
例：
var ui =["input","prompt","heading"];//数组中存放要查找的元素id
ui.forEach(function(id)){ //用每个id查找对应的元素
ui[id] = document.getElementById(id);//将其存放在一个属性中
});
这样就可用全局变量input(即window.input)代替ui.input
var $ = function(id){return document.getElementById(id);};
ui.prompt = $("prompt");
id元素在文档中是唯一的，name属性可以有多个相同的，具有该名称的隐式全局变量
会引用一个类数组对象，其元素就是所有命名的元素。
<iframe>中的name或id不会引用元素自身的Element对象，而是引用<iframe>元素创建的嵌套浏览器窗体的Window对象.
8、多窗口和窗体
一个Web浏览器窗口->多个标签页（每页独立的browsing context,独立的Window对象）,互不干扰。
嵌套的浏览上下文之间并不是独立的，在一个窗体中可以看到它的祖先和子孙窗体。（同源策略的限制）
若有同源策略的限制，则可以使用另一个窗口定义的对象、属性和方法。
HTML5提供一个基于事件的消息传输API，可以间接通信。
I-1 打开和关闭窗口
Window.open()载入指定的URL到新的或已存在的窗口中，并返回代表那个窗口的Window对象。4个可选参数
参数1，要在新窗口显示的文档的URL，省略则使用空页面的URL about:blank
参数2，新窗口的名字，若是已经存在的名字，则直接跳转。省略则使用指定的名字，"_blank"
只有设置的允许导航（allowed to navigate）的页面才可以通过窗口名字来操纵这个窗口的Web应用。
嵌套窗体可相互导航，可使用"_top"(顶级祖先窗口)和"_parent"（直接父级）来获取彼此的上下文
参数3，一个以逗号分隔的列表，包含大小和各种属性（菜单栏、状态栏、工具栏和地址栏），用以表明新窗口是如何打开的
var w = window.open("smallwin.html","smallwin","width=400,height=350,status=yes,resizable=yes");
参数4，布尔值，已存在同名（参数2）窗口时，是覆盖替换（true），还是创建一个新的（false），后者是默认值
opener属性引用的是打开它的脚本的Window对象（即父窗口的window对象），在新打开的窗口中其值为null
关闭窗口：window.close();//要显示调用，避免和Document对象的close()方法混淆
已关闭的窗口，代表它的Window对象还存在，即close属性为true，document为null，但它的方法不会再工作了。
I-2 窗体之间的关系
通过opener属性可以打开它的原始窗口，两者相互调用，读取属性
代表自己的window或self，引用父窗口的parent
parent.history.back();
parent ===self; //只有顶级窗口才返回true，top直接引用顶级
通过获取<iframe>元素引用子窗体
<iframe id ="f1">
var iframeElement = document.getElementById("f1");
<iframe>元素的contentWindow属性，引用该窗体的Window对象
var childFrame = document.getElementById("f1").contentWindow;
frameElement属性引用父窗口的Window对象,顶级窗口的该属性值为null
var elt = document.getElementById("f1");
var win = elt.contentWindow
win.fromeElement ===elt //=>true
window.frameElement ===null //=>true
类数组frames,引用自身包含的窗口（窗体）的子窗体（不含自身），通过数字或窗体名进行索引
如：第一个子窗体frame[0]
引用自己的兄弟窗体parent.frames[1]
注意：数组里的是Window对象，而不是<iframe>元素
若指定<iframe>元素的name或id属性，那么还可以通过名字索引
frames["f1"]或frames.f1
词法作用域限制，变量或函数的作用范围取决于定义它的作用域，而不是调用它的。