基础知识 首先参考画布分为视口(窗口)与文档的含义 网页很多都是多屏,所以文档尺寸一般大于视口尺寸 视口尺寸不包括浏览器工具条、菜单、标签、状态栏等 当打开控制台后,视口尺寸相应变小 文档像 position 定位,视口类似 fixed 定位 文档坐标在页面滚动时不发生改变 视口坐标的操作需要考虑滚动条的位置 视口文档 视口坐标需要知道滚动条位置才可以进行计算,有以下几种方式获取滚动位置 方法 说明 注意 window.innerWidth 视口宽度 包括滚动条(不常用) window.innerHeight 视口高度 包括滚动条(不常用) document.documen