BOM 浏览器对象模型

我们的BOM对象都是作为window对象的属性保存的，
我们可以通过window对象来访问

window

代表浏览器的窗口

setInterval()

定时调用

• 定时调用指每间隔一段时间就调用指定的函数一次

• 参数：

  • 回调函数，该函数将会每间隔一段时间被调用一次
  • 时间，函数调用相隔的时间（毫秒）

• 返回值：

  • 会返回一个number类型的值作为返回值，

  • 这个number就是定时器的标识

      var timer = setInterval(function(){ 
       count.innerHTML = num++;
      //判断num
      if(num == 11){
      //关闭定时器
      clearInterval(timer);
      }
      },1000);
    

clearInterval()

关闭一个定时调用
需要一个定时器的标识作为参数，需要用它来指定要关闭的定时器

clearInterval(timer);

setTimeout()

延时调用

• 延时调用指函数不马上执行，而是过一段时间以后再执行

• 使用setTimeout()来设置延时调用，

• setTimeout()和setInterval()用法一样

• 也是需要两个参数：

• 1.回调函数

• 2.毫秒数

• 延时调用中的函数，只会执行一次。而定时调用会执行多次

• 定时调用和延时调用本质上没有区别，我们可以通过setTimeout()

• 实现setInterval()的功能，

• 也可以通过setInterval()实现setTimeout()的功能

    var timer = setTimeout(function(){
            console.log(n++);
        },1000);
  

clearTimeout(timer);

关闭延时调用

---

window.navigator.geolocation

定位

getCurrentPosition( function1(position){}, function2(err){}, optionObj）;

• 该方法可获取设备当前位置信息

• 参数一：回调函数。如果成功获取位置信息，该回调函数会接收到一个position对象。position对象有两个属性：coords和timestamp（获取定位的时间戳）。coords又包含如下属性，

      longitude:  经度坐标
      latitude:   纬度坐标      
      accuracy:  经纬度坐标的精度（单位 米，值越大定位约不准）。
      altitude: 海拔高度（单位 米）
      altitudeAccuracy:  海拔高度精度（单位 米，值越大精度越差）,
      heading:  指南针方向。0°正北， 90°正东，180°正南，270°正西。
      speed: 速度 （单位 米/秒）
  

• 参数二：回调函数（可选），当设备无法获取地理信息时，该函数被调用。此时会接收到一个err对象。该对象有message和code属性。
  message: 描述错误的原因。

        code: 错误状态码
        0 未知错误
        1 用户拒绝共享地位位置信息。
        2 位置无效
  

• 参数三：选项对象（可选），一个JSON对象包含三个属性。

     timeout:  number （可选）。等待返回位置信息的最长时间（单位毫秒）,
     enableHighAccuracy:  boolean（可选） 。true表示经可能的使用精确的位置信息。除非确实非常需要精确的信息，否则建议使用false。如果设置true，数据返回时间慢，还会导致移动设备耗用更多电量。
    maximumAge: number（可选）。 上一次取得坐标的有效时间（单位毫秒），如果时间到，重新获取新的坐标信息。如果不需要平凡更新用户位置信息，建议设置为infinity。从始至终都使用第一次获取的位置信息。
  
    3 访问超时
  

watchPosition(function1(position){}, function2(err){}, optionObj）;

等待系统发出位置改变信号（不会主动轮询），该函数返回一个标识符。用于跟踪监控操作。clearWatch()通过该标识符取消监控操作（类似setTimeout()和clearTimeout()）。
该函数参数及作用与getCurrentPosition()完全相同。

clearWatch()

关闭获取定位

navigator

代表的浏览器的信息，通过该对象可以来识别不同的浏览器

    //获取浏览器信息
    var ua = navigator.userAgent;
        console.log(ua);
        //通过UserAgent来判断浏览器的信息
        if(/firefox/i.test(ua)){
            alert("你是火狐~~~");
        }else if(/chrome/i.test(ua)){
            alert("你是chrome浏览器~~~");
        }else if(/msie/i.test(ua)){
            alert("你是IE");
        }else if("ActiveXObject" in window){
            alert("你是IE11");
        }

---

history

代表的浏览器的历史记录，通过该对象可以控制浏览器向前或向后翻页

history.back();

退回到上一个页面

history.forward();

进入下一个页面

history.go(-2)

跳转到指定页面，需要一个整数作为参数

history.length

历史记录数量

history.pushState("lalal", null, "learn.html");

向浏览器中添加一条历史记录

• 第一个参数：数字，字符串，JSON对象

• 第三个参数存在同源（同域）问题
  如果参数是一个网址，协议，域名，端口必须与当前应用的协议，域名，端口完全相同

history.replaceState("lalalal", null, "learn.html");

替换当前历史记录

window.onpopstate事件

需要按浏览器上的后退或前进按键才会触发

window.onpopstate = function (ev) {
console.log(ev.state);
}

---

location

代表浏览器的地址栏的信息，通过该对象可以控制浏览器跳转页面

location = "test01.html";

跳转到指定页面，会生成历史记录可以使用会退按钮回退

location.assign("test02.html");

和直接修改location是一样的

location.replace("test02.html");

跳转到其他页面，不会生成历史记录。

location.reload(true);

可以用来刷新当前网页，相当于浏览器的刷新按钮

• 在该方法中可以传递一个true，如果传了true则会强制清空缓存属性网页

screen

代表用户的屏幕信息