前端-js基础-BOM浏览器对象模型1

#博学谷IT学习技术支持

目录

BOM概述

BOM——浏览器对象模型。提供了独立于内容而与浏览器窗口进行交互的对象，其核心对象是window。

BOM 由一系列相关的对象构成，并且每个对象都提供了很多方法与属性。

​ BOM 缺乏标准，JavaScript 语法的标准化组织是 ECMA，DOM 的标准化组织是 W3C，BOM 最初是Netscape 浏览器标准的一部分。

window 对象的常见事件

窗口加载事件

有了window.onload 就可以把JS代码写到页面元素的上方，因为onload是等页面内容全部加载完毕，再去执行处理函数

调整窗口大小事件

window.onresize 是调节窗口大小加载事件，当触发时就调用的处理函数

---

• BOM概述

  • BOM——浏览器对象模型。提供了独立于内容而与浏览器窗口进行交互的对象，其核心对象是window。

  • BOM 由一系列相关的对象构成，并且每个对象都提供了很多方法与属性。

  • ​ BOM 缺乏标准，JavaScript 语法的标准化组织是 ECMA，DOM 的标准化组织是 W3C，BOM 最初是Netscape 浏览器标准的一部分。

• window 对象的常见事件

  • 窗口加载事件

    • 

    • 有了window.onload 就可以把JS代码写到页面元素的上方，因为onload是等页面内容全部加载完毕，再去执行处理函数

    • window.onload 传统注册事件只能写一次，如果有多个，会以最后一个windowa.onload 为准
    • 如果使用addEventListener 则没有限制
    • load 等页面内容全部加载完毕，包含页面dom元素 图片 flash css 等等
    • DOMContentLoaded 是DOM 加载完毕，不包含图片 falsh css 等就可以执行 加载速度比 load更快一些

  • 调整窗口大小事件

    • window.onresize 是调节窗口大小加载事件，当触发时就调用的处理函数

      

    • 只要窗口大小发生像素变化，就会触发这个事件
    • 利用这个事件完成响应式布局。window.innerWidth 当前屏幕的宽度