javascript - 使用 Javascript 测量 div 的宽度

Question

我有两个问题。更重要的是如何测量div的宽度？不是获取 CSS 值，而是以 px 或 ems 等为单位。现在我正在这样做

document.getElementById("menu").addEventListener("click", GetWidth);
function GetWidth() {
var ulObject=document.querySelector(".dropdown-menu");
var obtainedStyle=window.getComputedStyle(ulObject);
var ulWidth=obtainedStyle.getPropertyValue("width");
console.log(ulWidth);
}

它在一定程度上有效。问题是 width 属性设置为 auto，但可能会改变。我如何获得它的任何可用值(value)？
第二个问题是如何使用类来创建事件处理程序？ querySelector 和 getElementByClassName 不起作用。
我现在宁愿避免使用 jQuery，但如果它是唯一的选择，我会选择它。How do I retrieve an HTML element's actual width and height?中给出的答案不起作用。即使我没有显示:无； offsetWidth 仍然显示 0。

Answer 1

使用getBoundingClientRect :

var rect = ulObject.getBoundingClientRect();
var ulWidth = rect.width;

如果需要支持IE8及之前版本，可以使用

var ulWidth = rect.right - rect.left;