• BOM总结


    一、BOM概念

      BOM:Browser Object Model  浏览器对象模型,定义了JS操作浏览器的一些方法和属性

    二、BOM方法 (在BOM里面大部分的方法都是调用window对象下的方法得到的)

      1、open(页面的地址url,打开的方式)  方法  打开一个新的窗口(页面)

        (1) 如果url为空,则默认打开一个空白页面;

        (2) 如果打开方式为空,默认为新窗口方式打开;

        (3) 如果不写参数,则以新窗口的方法打开一个空白页面;

        返回值:返回新打开的窗口window对象

      2、close()  方法  关闭窗口

        (1) ff: 默认无法关闭

        (2) chrome: 默认直接关闭

        (3) ie: 询问用户

    三、BOM属性

      1、window.navigator.userAgent :  可以得到当前浏览器的信息

      2、window.location : 浏览器地址信息

        (1) window.location.href : url   也是浏览器的地址信息

        (2) window.location.search : url?后面的内容

        (3) window.location.hash : url#后面的内容

    四、BOM 窗口尺寸大小

      1、可视区的尺寸

        document.documentElement.clientWidth

        document.documentElement.clientHeight

      2、 滚动条滚动距离(存在兼容)

        (1) 其他浏览器均认为是文档的滚动条,因此是文档下的:

          document.documentElement.scrollTop[scrollLeft] 

        (2) 谷歌浏览器认为滚动条是body的滚动条,因此是body下的:

          document.body.scrollTop[scrollLeft]          

        解决方案:

        var scrollTop = document.documentElement.scrollTop || document.body.scrollTop;

      

      3、 内容高 ( 不算边框外里面的内容 )

        oDiv.scrollHeight(Width);

      4、文档高

        document.documentElement.offsetHeight

        如果说获取documentElement的高度,会存在兼容问题,一般我们都是获取body的高度

        document.body.offsetHeight

    五、BOM 事件

      1、onscroll : 当滚动条滚动的时候触发

        window.onscroll = function (){  };

      2、onresize : 当窗口大小发生改变的时候触发

        window.onresize = function (){  };

  • 相关阅读:
    进度条功能
    网络编程
    并发编程
    UUID
    serverless 近期热度
    力扣 98. 验证二叉搜索树
    循环中多线程参数为空bug
    从头解决PKIX path building failed
    国内jenkins搭建不再龟速的方式
    CoachAI 2019年12月~2020年3月实习总结
  • 原文地址:https://www.cnblogs.com/effieduo/p/5102949.html
Copyright © 2020-2023  润新知