今日总结：BOM

编程入门行业动态更新时间:2024-10-10 23:20:37

今日总结：BOM

BOM介绍
- Brown Object Model 一系列与浏览器有关的信息
window对象
- 窗口位置
  - screenLeft
    - 返回浏览器窗口左侧相对于当前屏幕左上角的水平距离
  - screenTop
    - 返回浏览器窗口左上角相对于当前屏幕左上角的垂直距离
  - screenTop和screenLeft是不兼容火狐浏览器，screenX和screenY兼容火狐浏览器
- 窗口大小(IE9一下不兼容)
  - innerWidth 返回网页窗口中可见部分的高度，包含滚动条宽度
  - innerHeight 返回网页窗口中可见部分的高度，包含滚动条高度
  - outerWidth 返回浏览器窗口的宽度，包含浏览器菜单和边框
  - outerHeight 返回浏览器窗口的高度，包含浏览器菜单和边框
- 打开窗口
  - window.open()
    - 打开一个新的浏览器窗口
    - 参数：
      - url
      - 打开方式
        _self 替换当前页面
        
        _blank 加载到一个新的窗口
        
        _top
        
        _parent
      - 窗口参数
      - 是否取代当前页面的历史记录的布尔值
      - 文档参考：Window open() 方法 | 菜鸟教程 (runoob)
  - window.false()
    - 关闭新打开的窗口（仅限open打开的窗口）
window子对象
- screen对象
  - 功能：包含显示设备的信息
  - 个别属性列举
    - screen.height、screen.width返回设备的分辨率
    - screen.availWidth、screen.availHeight返回屏幕可用宽度，值为屏幕的实际大小减去操作系统某些功能占据的空间
- location对象
  - 功能：保存当前文档信息，将url解析为独立片段
  - 属性：
    - href
      - 返回当前页面完整的URL、修改这个属性级跳转新页面
    - hash
      - 返回URL中hash（#后面0或多个字符）
    - host
      - 返回服务器名称和端口号
    - port
      - 返回服务器端口号
    - pathname
      - 返回URL中的目录和文件名
    - hostname
      - 返回不带端口号的服务器名称
    - protocol
      - 返回页面使用的协议
    - search
      - 返回URL的查询字符串
  - 属性举例
    - 【vlog】齐奇哈尔组合足球赛！_哔哩哔哩_bilibili
- navigator对象
  - 提供一系列属性用于检测浏览器
  - onLine是否联网
  - userAgent
    - 浏览器嗅探
    - 检测浏览器类型
- history对象
  - 功能：保护用户的上网记录
  - 方法属性
    - go() 在用户历史记录中任意跳转，接受一个参数，后退-1，前进1，也可以传递一个字符串参数。跳转到第一个包含该字符串的位置。
    - back() 后退
    - forward() 前进
    - length 属性保存历史记录的数量