我想通过jQuery/JavaScript计算div元素的边界框。
我尝试了以下代码:
//盒子的左边
document.getElementById("myElement").offsetLeft;
//盒子的顶部
document.getElementById("myElement").offsetTop;
//盒子的右边
document.getElementById("myElement").offsetLeft + document.getElementById("myElement").offsetWidth;
//盒子的底部
document.getElementById("myElement").offsetTop + document.getElementById("myElement").offsetHeight;
它返回一些值。是否这是通过jQuery/JavaScript获取div元素边界框的正确方式。
我需要类似于SVG元素中的getBBox()方法。它将返回元素的x、y、width和height。同样,我如何获取div元素的边界框?
Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号
由于这是专门为jQuery标记的 -
$("#myElement")[0].getBoundingClientRect();或者
$("#myElement").get(0).getBoundingClientRect();(这两者在功能上是相同的,在一些旧浏览器中,
.get()稍微快一些)请注意,如果您尝试通过jQuery调用来获取值,它将不会考虑任何css变换值,这可能会导致意外的结果...
注意2:在jQuery 3.0中,它已经改为使用适当的
getBoundingClientRect()调用来进行自身的尺寸调用(请参见jQuery Core 3.0升级指南) - 这意味着其他jQuery答案最终将始终正确 - 但仅在使用新的jQuery版本时才正确 - 这就是为什么它被称为破坏性变更的原因...你可以通过调用getBoundingClientRect方法来获取任何元素的边界框。
var rect = document.getElementById("myElement").getBoundingClientRect();这将返回一个具有left、top、width和height字段的对象。