繁体   English   中英

如何在jQuery中获取div元素的边界框

[英]How to get bounding box for div element in jQuery

我想通过 jQuery/JavaScript 计算 div 元素的边界框。

我试过这样:

//Left side of box 
document.getElementById("myElement").offsetLeft; 
//Top side of box 
document.getElementById("myElement").offsetTop;  
//Right side of box
document.getElementById("myElement").offsetLeft + document.getElementById("myElement").offsetWidth; 
//Bottom side of box 
document.getElementById("myElement").offsetTop + document.getElementById("myElement").offsetHeight; 

它返回一些值。 通过 jQuery/JavaScript 获取 div 元素的边界框是否是正确的方法。

我需要像SVG元素中的getBBox()方法。 它将返回元素的xywidthheight 同样,如何获得 div 元素的边界框?

因为这是专门为 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();

这将返回一个带有左、上、宽和高字段的对象。

使用jQuery:

myelement=$("#myelement")
[myelement.offset().left, myelement.offset().top,  myelement.width(), myelement.height()]

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM