美文网首页JavaScript学习笔记
获取不同浏览器下视口的尺寸

获取不同浏览器下视口的尺寸

作者: 小人物的秘密花园 | 来源:发表于2021-04-02 11:01 被阅读0次

    概述

    最近在学习JavaScript高级程序设计(第三版)时,学习了获取不同浏览器中视口的大小,为了方便以后查阅,将相关的代码进行记录

    代码实现

    function getViewportSize() {
      var pageWidth = window.innerWidth,
        pageHeight = window.innerHeight;
      // 判断浏览器是否支持innerWidth
      if (typeof pageWidth !== 'number') {
        // 文档渲染模式是标准模式
        if (document.compatMode == 'CSS1Compat') {
          pageWidth = document.documentElement.clientWidth;
          pageHeight = document.documentElement.clientHeight;
        } else {
          // 文档渲染模式是混杂模式或怪异模式
          pageWidth = document.body.clientWidth;
          pageHeight = document.body.clientHeight;
        }
      }
      return {
        pageWidth,
        pageHeight
      }
    }
    

    参考资料

    相关文章

      网友评论

        本文标题:获取不同浏览器下视口的尺寸

        本文链接:https://www.haomeiwen.com/subject/myvfkltx.html