Professional JS(8.1.5导航和打开窗口/location/navigator/screen/history对象/Summary)

1.导航和打开窗口
①window.open()方法既可以导航到一个特定的URL，也可以打开一个新的浏览器窗口。

②这个方法接受4个参数：要加载的URL/窗口目标/一个特性字符串/一个表示新页面是否取代浏览器历史记录中当前加载页面的布尔值。通常只需传递第一个参数，最后一个参数只在不打开新窗口的情况下使用。

③第二个参数也可以是下列任何一个特殊的窗口名称：_self、_parent、_top、_blank。

//等同于<a href="http://www.baidu.com" target="topFrame"></a>window.open("http://www.baidu.com/","topFrame");

④在不打开新窗口的情况下，会忽略第三个参数。第三个参数是一个逗号分隔的设置字符串，表示在新窗口中都显示哪些特性。

⑤window.open()方法会返回一个指向新窗口的引用。

⑥调用close()方法还可以关闭新打开的窗口。该方法仅适用于通过window.open()打开的弹出窗口。弹出窗口关闭之后，窗口的引用仍然存在，但只能用于检测closed属性—-true

⑦新建的window独显有一个opener属性，其中保存着打开它的原始窗口对象。

var wroxWin=window.open("http://www.wrox.com","wroxWindow","height=400,width=400,top=10,left=10,resizable=yes");alert(wroxWin.opener==window);//true

2.间歇调用和超时调用
①JS是单线程语言，但它允许通过设置间歇时间值和超时值来调用代码在特定的时刻执行。前者是在每隔指定的时间就执行一次代码，后者是在指定的时间过后执行代码。

②超时调用需要使用window对象的setTimeout()方法，它接收两个参数：要执行的代码和以毫秒表示的时间。其中第一个参数可以是包含JS代码的字符串，也可以是一个函数。

//不推荐传递字符串---可能会导致性能损失setTimeout("alert('Hello yyc')",1000);//推荐的调用方式setTimeout(function(){    alert('Hello yyc');},1000);

③要取消尚未执行的超时调用计划，可以调用clearTimeout()方法并将相应的超时调用ID作为参数传递给它。

var timeoutId=setTimeout(function(){    alert('Hello yyc')},10000);clearTimeout(timeoutId);

④超时调用的代码都是在全局作用域中执行的，因此函数中this的值在非严格模式下指向window对象，在严格模式下是undefined。

⑤间歇调用与超时调动类似，只不过它会按照指定的时间间隔重复执行代码，直至间歇调用被取消或者页面被卸载。

⑥设置间歇调用的方法是setInterval()，它接收的参数与setTimeout()相同：要执行的代码（字符串或函数）和每次执行之前需要等待的毫秒数。

//不推荐setInterval("alert('Hello yyc')",10000);//推荐setInterval(function(){    alert('Hello world');},10000);var num=0;var max=10;var intervalId=null;function incrementNumber(){    num++;    if(num==max){        clearInterval(intervalId);        alert('Done');    }}intervalId=setInterval(incrementNumber,500);

⑦在使用超时调用时，没有必要跟踪超时调用ID，因此每次执行代码之后，如果不再设置另一个超时调用，调用就会自行停止。使用超时调用来模拟间歇调用是一种最佳模式。

var num=0;var max=10;function incrementNumber(){    num++;    if(num<max){        setTimeout(incrementNumber,500);    }else{        alert('Done');    }}setTimeout(incrementNumber,500);

3.系统对话框
①浏览器通过alert()/confirm()/prompt()方法来调用系统对话框向用户显示消息。

②alert()方法接受一个字符串并将其显示给用户。【指定的文本+OK按钮】

③confirm()方法与alert()的区别在于：【指定的文本+OK+cancel按钮】

if(confirm('Are you sure?')){    alert("l'm so glad you're sure!");}else{    alert("l'm sorry to hear you're not sure.");}

④prompt()方法，这是一个提示框，用于提示用户输入一些文本。该方法接受两个参数：显示给用户的文本提示+文本输入域的默认值（可能是一个空字符串）。

prompt("What's your name?",'yyc');var result=prompt("What's your name?",'');if(result!=null){    alert('Welcome, '+result);}

⑤这些系统对话框很适合向用户显示消息并请用户作出决定。

⑥还有两个异步显示的对话框：find()/print()

4.location对象
①location对象提供了与当前窗口中加载的文档有关的信息，还提供了一些导航功能。

②location对象是一个很特别的对象，既是window对象的属性，又是document对象的属性。

③查询字符串参数

function getQuertStringArgs(){    //获得查询字符串并去掉开头的问号    var qs=(location.search.length>0 ? location.search.substring(1) : ''),    //保存数据的对象    args={},    //获得每一项    items=qs.length ? qs.split('&'):[],    item=null,    name=null,    value=null,    i=0,    len=items.length;    //逐一将每一项添加到args对象中    for(i=0;i<len;i++){        item=items[i].split('=');        name=decodeURIComponent(item[0]);        value=decodeURIComponent(item[1]);        if(name.length){            args[name]=value;        }    }    return args;}

5.位置操作：assign(),replace(),reload()
①使用location对象可以通过很多方式来改变浏览器的位置。

②最常用的方式，assign()方法并为其传递一个URL

location.assign('http://www.wrox.com');//直接打开wrox官网window.location='http:www.wrox.com';//同上location.href='http://www.wrox.com';//"http://www.wrox.com"//假设初始URL为http://www.wrox.com/WileyCDA/location.hash='#section1';//http://www.wrox.com/WileyCDA/#section1location.search='?q=javascript';//http://www.wrox.com/WileyCDA/?q=javascript#section1location.hostname='www.dangdang.com';//https://www.yahoo.com/?err=404&err_url=https%3a%2f%2fwww.yahoo.com%2fWileyCDA%2f%3fq%3djavascriptlocation.pathname='mydir';//https://www.yahoo.com/?err=404&err_url=https%3a%2f%2fwww.yahoo.com%2fmydir%3ferr%3d404%26err_url%3dhttps%253a%252f%252fwww.yahoo.com%252fWileyCDA%252f%253fq%253djavascriptlocation.port=8080;

③每次修改location的属性（hash除外），页面都会以新URL重新加载。

④在IE8，Firefox 1，Safari 2+，Opear 9+和Chrome中，修改hash的值会在浏览器的历史记录中生成一条新记录。在IE的早期版本中，hash属性不会在用户单击’后退’和’前进’按钮时被更新，而只会在用户单击包含hash的URL时才会被更新。

⑤与位置有关的最后一个方法是reload()，作用是重新加载当前显示的页面。如果页面自上次请求以来并没有改变过，页面就会从浏览器缓存中重新加载。如果要强制从服务器重新加载，则需要为该方法传递参数true。

location.reload();//重新加载（有可能从缓存中加载）location.reload(true);//重新加载（从服务器重新加载）

⑥位于reload()调用之后的代码可能会不执行，这要取决于网络延迟或系统资源等因素。因此，最好将reload()放在代码的最后一行。

6.检查插件
①对于非IE浏览器，可以使用plugins数组来达到这个目的，该数组中的每一项都包含下列属性：
a)name：插件的名字。
b)description：插件的描述。
c)filename：插件的文件名。
d)length：插件所处理的MIME类型数量。

function hasPlugin(name){    name=name.toLowerCase();    for(var i=0;i<navigator.plugins.length;i++){        if(navigator.plugins[i].name.toLowerCase().indexOf(name)>-1){            return true;        }    }    return false;}alert(hasPlugin('Flash'));//false

②检测IE中的插件比较麻烦，因为IE不支持Netscape式的插件。在IE中检测插件的唯一方法就是使用专有的ActiveXObject类型，并尝试创建一个特定插件的实例。IE是以COM（Component Object Model）对象的方式实现插件的，而COM对象使用唯一标识符来标识。因此，要想检查特定的插件，就必须知道其COM标识符。例如，Flash的标识符是ShockwaveFlash.ShockwaveFlash。

function hasIEPlugin(name){//使用try-catch语句的原因，因此创建未知COM对象会导致抛出错误    try{        new ActiveXObject(name);        return true;    }catch(ex){        return false;    }}alert(hasIEPlugin('ShockwaveFlash.ShockwaveFlash'));function hasFlash(){    var result=hasPlugin('Flase');    if(!result){        result=hasIEPlugin('ShockwaveFlash.ShockwaveFlash');    }    return result;}function hasQuickTime(){    var result=hasPlugin('QuickTime');    if(!result){        result=hasIEPlugin('QuickTime.QuickTime');    }    return result;}alert(hasFlash());alert(hasQuickTime());

③plugins集合有一个名叫refresh()的方法，用于刷新plugins以反映最新安装的插件。这个方法接收一个参数：标识是否应该重新加载页面的一个布尔值。如果将这个值设置为true，则会重新加载包含插件的所有页面；否则，只会更新plugins集合，不重新加载页面。

7.注册处理程序
①registerContentHandler()方法接收三个参数：要处理的MIME类型，可以处理该MIME类型的页面的URL以及应用程序的名称。

/*第一个参数：RSS源的MIME类型，第二个参数：接收RSS源URL的URL,其中的%s表示RSS源的URL。*/navigator.registerContentHandler('application/rss+xml',    'http://www.somereader.com?feed=%s','Some Reader');

②Firefox 4及之前版本只允许在registerContentHandler()方法中使用三个MIME类型：application/rss+xml、application/atom+xml和application/vnd.mozilla.maybe.feed。这三个MIME类型的作用都一样，即为RSS或ATOM新闻源（feed）注册处理程序。

③registerProtocolHandler()方法也接收三个参数：要处理的协议（如，mailto或ftp）、处理该协议的页面的URL和应用程序的名称。

/*这个例子注册了一个mailto协议的处理程序，该程序指向一个基于Web的电子邮件客户端，%s表示原始的请求。*/navigator.registerProtocolHandler('mailto',    'http://www.somemailclient.com?cmd=%s','Some Mail Client');

④Firefox 2虽然实现了registerProtocolHandler()，但该方法还不能使用。Firefox 3完整实现该方法。

8.screen对象
①screen对象基本上只用来表明客户端的能力，其中包括浏览器窗口外部的显示器的信息，如像素宽度和高度等。

②availHeight/availLeft/availTop/availWidth/bufferDepth/colorDepth/deviceXDPI(Dots Per Inch)/deviceYDPI/fontSmoothingEnabled/height/left/logicalXDPI/logicalYDPI/pixelDepth/top/updateInterval/width

9.history对象
①history对象保存着用户上网的历史记录，从窗口被打开的那一刻算起。

②因为history是window对象的属性，因此每个浏览器窗口、每个标签页乃至每个框架，都有自己的history对象与特定的window对象关联。

③使用go()方法可以在用户的历史记录中任意跳转，可以向前也可以向后。

//后退一页history.go(-1);//前进二页history.go(2);

④也可以给go()方法传递一个字符串参数，此时浏览器会跳转到历史记录中包含该字符串的第一个位置—-可能前进，也可能后退。

⑤还有两个简写方法back()和forward()来代替go()。一个后退，一个前进。

//后退一页history.back();//前进一页history.forward();

⑥history对象还有一个length属性，保存着历史记录的数量。

⑦当页面的URL改变时，就会生成一条历史记录。在IE8+、Opera、Firefox、Safari 3+以及Chrome中，这里所说的改变包括URL中hash的变化（因此，设置location.hash会在这些浏览器中生成一条新的历史记录）。

10.Summary
①浏览器对象模型（BOM）以window对象为依托，表示浏览器窗口以及页面可见区域。同时，window对象还是ES中Global对象，因此所有全局变量和函数都是它的属性，且所有原生的构造函数以及其他函数都存在于它的命名空间下。

②在使用框架时，每个框架都有自己的window对象以及所有原生构造函数及其他函数的副本。每个框架都保存在frames集合中，可以通过位置或名称来访问。

③top对象使用指向最外围的框架，也就是整个浏览器窗口。

④parent对象表示包含当前框架的框架，而self对象则回指window

⑤使用location对象可以通过编程方式来访问浏览器的导航系统。设置相应的属性，可以逐段或整体性地修改浏览器的URL。

⑥调用replace()方法可以导航到一个新URL，同时该URL会替换浏览器历史记录中当前显示的页面。

⑦navigator对象提供了与浏览器相关的信息（插件、注册处理程序等）（plugins数组，registerContentHandler()，registerProtocolHandler()）

⑧screen对象中保存着与客户端显示器相关的信息，这些信息一般只用于站点分析（各种属性）。

⑨history对象为访问浏览器的历史记录开了一个小缝隙，开发人员可以据此判断历史记录的数量，也可以在历史记录中向前或向后导航到任意页面（go(),back(),forward(),length）。

11.try-catch语句（17.2.1—500）
①基本语法

try{    //可能会导致错误的代码}catch(error){    //发生错误时怎么处理}

②如果try语句中的任何代码发生错误，就会立即退出try语句，然后接着执行catch块。此时，catch块接收到一个包含错误信息的对象。与其他语言中不同的是，即使你不想使用这个错误对象，也要给它起个名字。这个对象中包含的实际信息会因浏览器而异，但共同的是有一个保存着错误消息的message属性。ECMA-262还规定了一个保存错误类型的name属性。

try{    window.someNonexistFunction();}catch(error){    alert(error.message);//window.someNonexistFunction is not a function}

③message属性是唯一个能保证所有浏览器都支持的属性。
a)IE添加了与message属性完全相同的description属性，还添加了保存着内部错误数量的number属性。
b)Firefox添加了filename、lineNumber和stack（包含栈跟踪信息）属性
c)Safari添加了line（表示行号）、sourceId（表示内部错误的代码）和sourceURL属性。