BOM中的那点事-window(一)
ECMAScript是JavaScript语言的核心，但是如果要想在web中使用JavaScript，恐怕BOM(浏览器对象模型)才是真正的核心。BOM提供了很多对象和函数用于访问浏览器的功能，这样功能和所有网页内容无关。由于缺少BOM规范，因此BOM显得既强大又有很多的问题，由于各大浏览器按照自己的想法和设计实现和扩展BOM，于是各个浏览器实现BOM之间共同存在的对象和标准成了事实上的标准，首先我们开了解一下BOM中的window对象。
1. 全局作用域
window对象同时扮演者ECMAScript中全局对象的角色，因此所有在全局作用域中声明的变量和函数都变成了window的属性和方法，如下示例：
1 var age = 26; 2 function sayAge() { 3 alert(this.age); 4 }; 5 6 alert(window.age); 7 this.sayAge(); 8 window.sayAge();
假设上面的示例运行在全局作用域下，首先声明全局变量age，然后定义一个全局函数sayAge，该函数中使用this来访问变量age，由于代码运行在全局作用域下，因此此处的this实际指向window对象，因此可以访问到全局变量，也就是window的属性age，最后一行可以通过window来访问sayAge函数，再一次证明全局函数sayAge实际属于window对象。
2. 窗口关系以及frame
加入页面中含有frame，那么每个frame都包含自己的window对象，而window对象的frames属性包含了当前框架中的所有子框架对象，可以通过下标或者名称来访问，如window.frames[0]或者window.frames["topFrame"]，如以下的html示例：
1 <html lang="en" xmlns="http://www.w3.org/1999/xhtml"> 2 <head> 3 <meta charset="utf-8" /> 4 <title></title> 5 <script defer="defer"> 6 //<![CDATA[ 7 alert(window.frames.length); //输出3 8 //alert(top.frames.length); 9 //]]> 10 </script> 11 </head> 12 <frameset rows="160, *"> 13 <frame src="frame.html" name="topFrame" /> 14 <framset cols="50%, 50%"> 15 <frame src="anotherFrame.html" name="leftFrame" /> 16 <frame src="yetAnotherFrame.html" name="rightFrame" /> 17 </framset> 18 </frameset> 19 </html>
上面的代码示例会输出3，因为最外层框架中包含了3个子框架，但是如果我们想知道最外层框架包含的子框架框架数，最好使用top来访问，由于每个frame都包含自己的window对象，因此通过window.frames访问到的可能并非最外层的框架包含的子框架数，但是top始终指向最高层的框架，也就是浏览器窗体，因此不管在哪个层级的window中访问，都返回最外层框架的子框架数。和top对应的一个属性就是parent，parent指向当前框架的直接父级框架，如以下代码示例：
1 <html lang="en" xmlns="http://www.w3.org/1999/xhtml"> 2 <head> 3 <meta charset="utf-8" /> 4 <title></title> 5 <script type="text/javascript" defer="defer"> 6 //<![CDATA[ 7 alert(window.frames.length); 8 //]]> 9 </script> 10 </head> 11 <frameset rows="200, *"> 12 <frame src="topFrame.html" name="topFrame" /> 13 <frameset cols="50%, 50%"> 14 <frame src="anotherFrame.html" name="leftFrame" /> 15 <frame src="anotherFrameSet.html" name="rightFrameSet" /> 16 </frameset> 17 </frameset> 18 </html>
在Main.html中的JavaScript代码中输出3，因为在其框架下面包含了三个字框架，但是在子框架中访问window.frames.length只是返回了子框架包含的框架个数，如下代码所示：
1 <html lang="en" xmlns="http://www.w3.org/1999/xhtml"> 2 <head> 3 <meta charset="utf-8" /> 4 <title></title> 5 <script type="text/javascript" defer="defer"> 6 //<![CDATA[ 7 alert(window.frames.length); 8 //]]> 9 </script> 10 </head> 11 <frameset cols="50%, 50%"> 12 <frame src="left.html" name="subLeft.html" /> 13 <frame src="right.html" name="subRight.html" /> 14 </frameset> 15 </html>
以上代码的JavaScript输出为2，因为当前框架只包含两个子框架。
欢迎批评指正。
