Question

我有一个用jQuery动态创建的表，它有很多列。我不知道桌子里会是什么，或者会有多少列。根据td内部的内容，每个td将具有不同的宽度。我想要做的是获取td的宽度并将其用于以后。

正如您所看到的，它具有不同大小的列。所以我只想去获取每个元素的宽度。这是我的代码：

var topTds = $("#ResultSetTable tr:first");
topTds = topTds.children();
console.log(topTds);
//for each of the tds we want to go and get their scrollwidth
for(var m = 0; m < topTds.length; m++){
    console.log(topTds[m], "client: ", topTds[m].clientWidth, "offset ", topTds[m].offsetWidth, "scroll ", topTds[m].scrollWidth);
}

正如你所看到的，我已经尝试了所有可以想到的不同宽度的东西，但它们并没有打印出正确的数字。这是我得到http://imgur.com/ZavrE6r

的结果

然而，当我使用chrome滚动时，我会得到不同的数字，并且铬数字是正确的。这就是chrome显示http://imgur.com/jO7TRr6

的内容

所以基本上我不知道我做错了什么。任何帮助都会非常感激！

Answer 1

当您使用jQuery时，您可以利用所提供的width()方法。

for(var m = 0; m < topTds.length; m++) {
    console.log(topTds[m], "jQuery width: ", topTds.eq(m).width());
}

clientWidth，offsetWidth和scrollWidth代表不同的数量，因为CSS属性和框模型，计算HTML元素的最终宽度可能非常棘手。此外，您应该检查何时调用console.log，是否加载了所有CSS和JavaScript，以及填充数据的表：这些可能是您获得奇怪值的原因。

根据我的经验，jQuery的width()从未在计算对象的实际宽度时失败。

一些参考：

获取现有td元素的宽度

1 个答案: