Javascript 如何使用AngularJS获取元素的宽度？

我意识到我可以使用jQuery获得元素的宽度，但我很好奇；有没有使用AngularJS的方法呢？

原生JS（#id）：

原生JS（querySelector（类、id、css3选择器））：

将其插入angular.element：

angular.element(document.getElementById(id)).clientWidth;
angular.element(document.querySelectorAll(".class")[0]).clientWidth;

如果需要获取非舍入数，请使用getBoundingClientRect

angular.element(document.getElementById(id)).getBoundingClientRect();

关于该主题的一些资源：

---

如果这在语法方面让你大吃一惊，并且不需要将jQuery插入到组合中，那么要小心跨浏览器的地狱。

如果你像我一样对所有这些建议感到困惑，但它们都不起作用，我发现我必须设置一个超时。我不知道为什么，可能是因为我在我的div中使用了材质设计属性

setTimeout(function(){
     var divsize = angular.element(document.getElementById('fun_div')).prop('offsetWidth');   
     console.log('Width of fun_div: ' + divsize);
    },50);

---

css是否为框大小调整或自动计算宽度提供了正确的值？请尝试

$（'element'）.width（）在js中。。使用您的ID或类替换
元素
。参考：@MoorthyGK没有Sizzle库（用于选择器），jQLite中也没有width插件。回答前请先阅读问题。或者您可以使用
getBoundingClientRect
。它会给你一个宽度和其他有用的数字。所有主要的浏览器，IE4+。也许我遗漏了什么，但是
angular.element
示例对我来说不起作用。我认为您需要从jqLite包装器中打开DOM元素，以便访问基本的DOM方法/属性。i、 e.
angular.element（document.getElementById（id））[0].clientWidth
，而不是
angular.element（document.getElementById（id））.clientWidth
这当然会使本例中的整个
angular.element
事情变得愚蠢，但有必要这样做，从
链接中获取普通dom元素，比如说，函数
元素
是正确的@ZachlySoby…至少在Chrome中，您需要选择第一个元素：angular.element（document.getElementById（id））[0].ClientWidths为此目的使用setTimeout不是一个好主意。在这种情况下，您假设浏览器将在50毫秒内完成所需的所有渲染。我相信现代PC可以处理这一点，但经济型智能手机呢？使用Angulars$timeout，它保证在调用您的函数之前完成所有渲染。@HammerNL我同意。
angular.element(document.getElementById(id)).getBoundingClientRect();

setTimeout(function(){
     var divsize = angular.element(document.getElementById('fun_div')).prop('offsetWidth');   
     console.log('Width of fun_div: ' + divsize);
    },50);