獲取現有td元素的寬度

我有一個動態使用jQuery創建的表，它有許多列。我不知道桌子上會有什麼，或者有多少列。根據td內部的內容，每個td將具有不同的寬度。我想要做的是獲得td的寬度並在以後使用它。獲取現有td元素的寬度

這是我的表可以看起來像。 http://imgur.com/80Zj7wB

正如你可以看到它有不同大小的列。所以我只想去獲得每個元素的寬度。這是我的代碼：

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

但是，當我滾動使用鉻我得到不同的數字，它的鉻數是正確的。這是鉻顯示http://imgur.com/jO7TRr6

所以基本上我不知道我做錯了什麼。任何幫助將非常感激！

來源

2013-10-06 Pompey

當您使用jQuery時，您可以利用提供的width()方法。

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

clientWidth，offsetWidth和scrollWidth代表不同數量時，以及計算HTML元素的最終寬度可以是因爲CSS屬性和盒模型的相當棘手。此外，你應該檢查什麼時候調用console.log，如果加載了所有CSS和JavaScript，並且表中填充了數據：這些可能是你得到的奇怪值的原因。

根據我的經驗，jQuery的width()永遠不會計算對象的實際寬度。

一些參考：

來源

2013-10-06 01:56:42

獲取現有td元素的寬度

回答

相關問題