1. 犀牛前端部落首页
  2. JavaScript百科

js获取DOM元素相对于浏览器窗口的位置

Internet Explorer自从您可能关心就一直支持此功能,并且最终在CSSOM视图中对其进行了标准化。 很久以前,所有其他浏览器都采用了它。

一些浏览器还返回height和width属性,尽管这是非标准的。 如果您担心与旧版浏览器的兼容性,请查看此答案的修订版以实现优化的降级实现。

element.getBoundingClientRect()返回的值是相对于视口的。 如果您需要相对于另一个元素的矩形,只需从另一个矩形中减去一个矩形

例如以下代码:

var bodyRect = document.body.getBoundingClientRect(),
    elemRect = element.getBoundingClientRect(),
    offset   = elemRect.top - bodyRect.top;

alert('Element is ' + offset + ' vertical pixels from <body>');

原创文章,作者:犀牛前端部落,如若转载,请注明出处:https://www.pipipi.net/2969.html

发表评论

登录后才能评论