📅  最后修改于: 2023-12-03 15:31:45.572000             🧑  作者: Mango
JavaScript可以轻松获取在浏览器中打开的当前窗口的位置。当然,这里所说的位置是指窗口在浏览器中的左上角的坐标值,而不是文档中某个元素的位置。在下面的代码片段中展示了如何获取不带参数的当前窗口位置:
let windowLeft = window.screenLeft ? window.screenLeft : window.screenX;
let windowTop = window.screenTop ? window.screenTop : window.screenY;
console.log(`当前窗口位置:${windowLeft}, ${windowTop}`);
在上面的代码片段中,首先使用window.screenLeft
和window.screenTop
属性获取窗口在屏幕上的位置,然后根据不同的浏览器兼容性分别使用window.screenLeft
和window.screenX
、window.screenTop
和window.screenY
来获取窗口在屏幕上的位置。最后将位置信息输出到控制台。
需要注意的是,这里获取的位置是相对于屏幕的位置,因此如果用户在浏览器中缩放了页面,那么获取到的位置信息并不一定准确。如果需要获取相对于文档的位置信息,可以使用document.documentElement.getBoundingClientRect()
方法获取窗口位置信息,具体可参考下面的代码片段:
let {left: documentLeft, top: documentTop} = document.documentElement.getBoundingClientRect();
console.log(`当前窗口位置:${documentLeft}, ${documentTop}`);
在上面的代码片段中,使用document.documentElement.getBoundingClientRect()
方法获取文档元素的位置信息,并将位置信息解构为documentLeft
和documentTop
,然后输出到控制台。需要注意的是,由于getBoundingClientRect()
方法返回的是相对于文档的位置信息,因此无需考虑用户在浏览器中缩放页面的情况。