2.03.12BOM对象与window对象

2.03.11 BOM对象 与 Window对象

1.BOM

1. 介绍：BOM是browser object model的缩写，简称浏览器对象模型 ，提供了独立于内容而与浏览器窗口进行交互的对象；使用浏览器对象模型可以实现与HTML的交互。它的作用是将相关的元素组织包装起来。提供给程序设计人员使用，从而降低开发人员的劳动量，提高设计Web页面的能力。BOM是一个分层结构：
   

• 提供对浏览器进行操作的一些API（对浏览器进行操作的一套标准）

2. BOM结构下的成员对象

• window对象 ，是JS的最顶层对象，其他的BOM对象都是window对象的属性；
• document对象，当前窗口内的文档节点对象；
• frames对象， 是一个类数组对象，列出了当前窗口的所有直接子窗口；
• history对象，对象提供了操作浏览器会话历史（浏览器地址栏中访问的页面，以及当前页面中通过框架加载的页面）的接口；浏览器历史信息对象
• location对象，浏览器当前URL信息；浏览器地址信息对象
• navigator对象，浏览器本身信息；浏览器设备信息对象
• screen对象，当前渲染窗口中和屏幕有关的属性。 浏览器屏幕信息对象

2.window对象

1.概念

• BOM的核心对象是window,在浏览器中,window具有双重角色,它既是JavaScript访问浏览器窗口的的一个接口,也是ECMAScript中规定的全局对象

2.window全局作用域

1. 定义在全局环境下的变量都会成为window对象的属性

    var age = 40;

    function getAge(){
        return window.age;
    }

• 注意：把变量定义在函数体内,可以有效地减少全局环境下的变量冲突,避免污染全局环境

2. 在函数内部不用var声明的变量会成为全局变量,即window的对象属性

    (function (){
        age = 19
    })() 

    function getAge(){
        return window.age;
    }

• 注意：两种方式创建的全局变量的区别是通过var在全局作用域下声明的变量用delete无法删除

    var address = 'gz';

    (function (){
        age = 19
    })()

    function getAge(){
        delete window.address
        delete window.age
        console.log(window.address,window.age) ;  //gz undefined
    }

    getAge();
}

3. window对象可以在代码中省略,例:window.alert()可以直接写成alert()

    window.alert('hello1');

    alert('hello2');

3.window的属性

1. Window.screenX

• 介绍：是一个只读属性，它返回浏览器左边框到操作系统桌面左边屏幕边缘的 CSS 像素数。
• 注意：screenLeft 只是Window.screenX 属性的别名，最初只被 IE 浏览器所支持。现在主流的浏览器都已支持该属性。

2. window.screenY

• 介绍：是一个只读属性，它返回浏览器顶部到操作系统桌面顶部屏幕边缘的 CSS 像素数。
• 注意：screenTop 只是Window.screenY 属性的别名，最初只被 IE 浏览器所