BOM & history & location & navigator

…browser浏览器对象模型，操作的是浏览器窗口。window是最顶端的对象。js三大组成= ECMAScript(ECMA)+BOM+DOM(W3C)

BOM

1. 基本概念

​    (1) 全局变量都是window对象的属性，使用时可以省略window对象

​    (2) 若函数内没有通过var声明的变量，会被当做全局变量

​    (3) 把变量声明在函数内部

​    (4) 避免全局污染，全局变量起名字不要起name、top

​    (5) 避免命名冲突

​    (6) 一般window的方法可以省略window的调用，例如window，alert()可以省略window

​    (7) window对象本身存在的属性及事件，调用的时候尽量不要省略window的调用

​    (8) 不要对window本身存在的属性赋值 !!!

​    (9) 全局变量无法用delete删除

2. window的属性及方法

​    (1) 浏览器窗口尺寸

​      ① window.innerWidth / window.innerHeight

​       a) 表示浏览器窗口”可视区域”尺寸

     ② window.outerWidth/window.outerHeight

      a) 表示浏览器窗口尺寸

​ ​    (2) 与滚动相关

     ① window.scrollX/scrollY

      a) 获取浏览器窗口的高度

     ② window.scrollTo(x,y)

      a) 设置浏览器滚动到的位置

     ③ window.scrollBy(x,y)

      a) 设置相对于当前滚动位置滚动的距离(往左、上为负值，往右、下为正值)

3. window对象常用事件

   (1) window.onscroll 浏览器滚动条滚动时触发函数

window.onscroll = function(){}

    (2) window.onload 等待页面加载完毕后触发

    (3) window.onresize 屏幕尺寸改变时触发

4. 系统弹窗

    (1) alert() 弹窗

    (2) prompt(msg,默认值) 输入框，返回值为消息或者是null

   (3) confirm(msg) 确认框，返回值为布尔值

   (4) open(url) 打开一个新窗口并返回新 window 对象

   (5) close() 关闭本窗口

   (6) print() 调出打印对话框

5. 属性对象

   (1) Document 文档对象

     a) 可以在js脚本中直接访问访问页面元素

    (2) history 历史对象，包含窗口的浏览历史，可以实现后退

     属性：length返回浏览器历史列表中的URL数量

     方法：back()加载 history 列表中的前一个 URL

        forward() 加载 history 列表中的下一个 URL

        go() 加载 history 列表中的某个具体页面，支持负数。

          a) history.go(2);//向前两个页面

          b) history.go(-2);//后退两个页面

   (3) location 保存文档的相关信息

     1. href 设置或返回完整的URL

     2. hash 设置或返回从(#)开始的URL(锚)==>哈希值

     3. search 设置或返回从问好(?)开始的URL(查询部分)，URL的参数

       a) encodeURI(); //转码

       b) decodeURI(); //解码

   (4)navigator 导航对象, 包含所有有关访问者浏览器的信息，通常用于检测浏览器类型

     1. appName 浏览器名称

     2. appVersion 浏览器版本

     3. platform 操作系统

     4. userAgent 用户代理信息，通过该属性可以获取浏览器及操作系统信息

     5. geolocation 获取地理位置信息