获取浏览器中各种元素高度宽度

获取屏幕（硬件）分辨率

我的屏幕设置分辨率为1920*1080

获取屏幕高度、宽度示例，单位像素。

            // 获取显示器高度
            let h = screen.height;
            console.log("屏幕高度", h);// 屏幕高度 1080
            // 获取显示器宽度
            let w = screen.width;
            console.log("屏幕宽度", w);// 屏幕宽度 1920

其他方式：

屏幕分辨率的高：window.screen.height 
屏幕分辨率的宽：window.screen.width 

获取浏览器窗口高度、宽度

下图中红色方框部分就是浏览器窗口，不包括工具栏、菜单等，但包括滚动条。

innerHeight 返回窗口的文档显示区的高度，如果有垂直滚动条，也包括滚动条高度。

innerWidth 返回窗口的文档显示区的宽度，如果有水平滚动条，也包括滚动条高度。

获取浏览器窗口高度、宽度示例：

            let windowHeight = window.innerHeight;
            let windowWidth = window.innerWidth;
            console.log("窗口高度", windowHeight);// 窗口高度 969
            console.log("窗口宽度", windowWidth);// 窗口宽度 1597

获取浏览器软件的宽度、高度

这次获取的值包括菜单栏、工具栏等。不包括电脑底部的任务栏。

outerHeight 属性设置或返回一个窗口的外部高度，包括所有界面元素（如工具栏/滚动条）。

outerWidth 属性设置或返回窗口的外部宽度，包括所有的界面元素（如工具栏/滚动）。

            let outerHeight = window.outerHeight;
            let outerWidth = window.outerWidth;
            console.log("窗口高度", outerHeight);
            console.log("窗口宽度", outerWidth);