屏幕、窗口、文档之间的区别

屏幕、窗口、文档之间的区别

屏幕

屏幕尺寸是屏幕的宽度和高度：显示器或移动屏幕。window.screen是保存屏幕尺寸信息的对象。

• screen.width：屏幕的宽。
• screen.height：屏幕的高。

可用屏幕尺寸

可用的屏幕大小由活动屏幕的宽度和高度组成，没有操作系统工具栏。

• screen.availWidth：可利用的宽，等于屏幕的宽。
• screen.availHeight：可利用的高，等于屏幕的高减去 mac 顶部栏或 windows 底部栏。

屏幕距离

• screenTop：浏览器窗口左上角到屏幕上边缘的距离。
• screenLeft：浏览器窗口左上角到屏幕左边缘的距离。 Firefox 浏览器不支持上述属性，但是可以使用👇:
• screenX：等于 screenLeft。
• screenY：等于 screenTop。

window窗口

窗口的外部大小由整个浏览器窗口的宽度和高度组成，包含地址栏，选项卡栏和其他浏览器面板。

• window.outerWidth：浏览器窗口的宽。
• window.outerHeight：浏览器窗口的高。

窗口内部尺寸

窗口的内部大小（也称为视口大小）由显示网页的视口的宽度和高度组成，包含滚动条。

• window.innerWidth：视口的宽。
• window.innerHeight：视口的高。