JavaScript总结(二)--获取Window 尺寸

作者: 风的低语 | 来源:发表于2018-06-20 14:38 被阅读12次

JavaScript总结(二)--获取Window 尺寸
一张图带你了解 JavaScript DOM、事件的尺寸和位置
JavaScript经典代码总结
14.appium基础--滑动操作
[JavaScript] (Day-16) - 浏览器对象
(浏览器)浏览器对象
iOS-07-iOS获取UIWebView中的网页信息
2018-11-10-JavaScript复习总结
移动端dpr
原生js的基础方法等四，bom的操作

/*Window 尺寸

有三种方法能够确定浏览器窗口的尺寸（浏览器的视口，不包括工具栏和滚动条）。
对于Internet Explorer、Chrome、Firefox、Opera 以及 Safari：

    window.innerHeight - 浏览器窗口的内部高度
    window.innerWidth - 浏览器窗口的内部宽度

对于 Internet Explorer 8、7、6、5：

    document.documentElement.clientHeight
    document.documentElement.clientWidth

或者

    document.body.clientHeight
    document.body.clientWidth

实用的 JavaScript 方案（涵盖所有浏览器）：
*/

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8" />
        <title></title>
    </head>
    <body>
        
        <p id="demo"></p>
        
        <script>
            
            var w = window.innerWidth
            || document.documentElement.clientWith
            || document.body.clientWith;
            
            var h = window.innerHeight
            || document.documentElement.clientHeight
            || document.body.clientHeight;
            
            x = document.getElementById("demo");
            
            x.innerHTML = "浏览器的内部宽度:"+ w + ", 高度" + h + ".";
            
        </script>
    </body>
</html>