BOM简介

## BOM

- BOM简介

  Browser Object Model:独立于内容,与浏览器交互的对象。核心是window对象。

  DOM[w3school规范] VS BOM[各家浏览器规范]

- window对象(定时器)

  浏览器的顶级对象

  1:js访问浏览器窗口的一个接口

  2:全局变量,定义再全局作用域种的变量或函数,会自动成为window对象的属性

- 页面加载事件

  窗口加载事件:文档内容完全加载(图片、脚本、css等)完成,触发事件。

  window.onload = function(){}

  DOMContentLoaded DOM加载完毕 不包含样式、图片、flash等

  document.addEventListener('DOMContentLoaded',function(){

      console.log(123);

  });

  //DOM0、DOM2级绑定皆可

  //1 只要窗口大小发生像素变化,会触发该事件

  //2 可以实现响应式 window.innerWidth获取当前屏幕宽度

  窗口大小事件  window.onresize = function(){

      console.log(window.innerWidth);

  };

- 定时器

  window.setTimeout(函数,延迟时间);

  clearTimeout(timeoutID);

  window.setInterval(函数,延迟时间);//clearInterval();

- location 对象/ navigator 对象/history 对象

    location对象

        通过location.href:实现网页跳转[获取或设置整个url]

        location.host:获取主机地址

        location.search:获取传的参数

        location.assign() 和 href一样

        location.replace() 替换当前页面 [特点:不能后退,因为没有记录历史]

        location.reload() 重新加载页面

    navigator对象

        navigator.userAgent

    history对象

        back()          后退

        forward()       前进

        go()            go(N):往前跳N页(N>0)   go(M):(M<0)往后跳M页

页面跳转

setTimeout(function() {

location.href = 'http://www.baidu.com';

        }, 4000);

posted @ 2020-06-05 11:38  小海_macro  阅读(151)  评论(0编辑  收藏  举报