Question

我试图使用以下代码获取angularJs中'th'元素的clientWidth：

var cols = this._element.find("th");

angular.forEach(cols, function(col) {
    var th = angular.element(col);
    console.log(th);
    console.log(th[0].clientWidth);
    th.css('width', th[0].clientWidth + "px");
});

当我打印元素（第一次打印）时，我得到以下内容：

[th]
  0: th.ng-hide
    abbr: ""
    ...
    clientWidth: 0

这正是我期望它的价值（因为它是一个隐藏的元素）。但是，当我尝试使用：

访问clientWidth时

th[0].clientWidth

我的值为12 ......

我已经尝试了很多元素（完整的表和所有的，隐藏的和非隐藏的），所有这些元素似乎都在元素上有适当的值，但是当我尝试时给我不正确的值并访问它们。

clientWidth和innerWidth也始终相同。似乎都没有反映出我对元素的看法。

关于为什么会这样的任何想法？

Answer 1

使用clientWidth，如果我为hidden元素打印0，我将clientWidth设为innerWidth，而$(document).ready(function() { $('.hide').css('display', 'none'); var temp = "<br>innerWidth:" + $('.hide').innerWidth(); temp += "<br>clientWidth(from [th] object):" + $('.hide')[0].clientWidth; var obj = new Object($('.hide')); $('#show').html(temp); console.log($('.hide').innerWidth()); console.log($('.hide')[0].clientWidth); console.log($('.hide')); });则为<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <table> <th>Heading Shown</th> <th class='hide'>Heading Hidden</th> </table> <div id="show"> </div>这个元素的实际内部宽度是你要找的吗？

代码段

＆＃13;

{{1}}

＆＃13;

{{1}}

＆＃13;

希望这有帮助。

为什么我的clientWidth在打印时会发生变化？

1 个答案: