0

我只想在表格加载后获取表格列宽，这样我就可以删除列中多余的空格并使其看起来紧凑。我想要的所有表格单元格应该只占用包含它的数据所需的宽度。

表结构是这样的：

<table style="display: table;"> 
    <tbody>
        <tr>
            <td></td> 
            <th>word</th>
            <th>%</th>
        </tr> 
        <tr> 
            <th>word</th> 
            <td><span class="count" style="display:block"> 1</span></td>
            <td><span class="percentage" style="display: block;"> 2.6%</span></td>
        </tr>
        <tr> 
            <th>word - word word word</th> 
            <td><span class="count" style="display:block"> 1</span></td>
            <td><span class="percentage" style="display: block;"> 2.6%</span></td>
        </tr>
        <tr> 
            <th>word - word word word word word</th> 
            <td> 1</span></td>
            <td><span class="percentage" style="display: block;"> 2.6%</span></td>
        </tr>
        <tr> 
            <th>word - word word</th> 
            <td> 2</span></td>
            <td><span class="percentage" style="display: block;"> 5.1%</span></td>
        </tr>
        <tr> 
            <th>word - word word word</th> 
            <td><span class="count" style="display:block"> 1</span></td>
            <td><span class="percentage" style="display: block;"> 2.6%</span></td>
        </tr>
        <tr> 
            <th>word - word word word word</th> 
            <td><span class="count" style="display:block"> 1</span></td>
            <td><span class="percentage" style="display: block;"> 2.6%</span></td>
        </tr>
        <tr> 
            <th>word - word word word</th> 
            <td><span class="count" style="display:block"> 2</span></td>
            <td><span class="percentage" style="display: block;"> 5.1%</span></td>
        </tr>
        <tr> 
            <th>word - word word</th> 
            <td><span class="count" style="display:block"> 3</span></td>
            <td><span class="percentage" style="display: block;"> 7.7%</span></td>
        </tr>
        <tr> 
            <th>word - word word</th> 
            <td><span class="count" style="display:block"> 25</span></td>
            <td><span class="percentage" style="display: block;"> 64.1%</span></td>
        </tr>
        <tr> 
            <th>word</th> 
            <td> 2</span></td>
            <td><span class="percentage" style="display: block;"> 5.1%</span></td>
        </tr>
    </tbody>
</table>
4

3 回答 3

0

你的css可能有问题。否则，默认情况下 html 表格列占用的空间仅与任何 td 的最大内容一样多

我认为您不需要获得宽度，也许您只能像 Rohan 所说的那样修剪（删除空格）表格中的所有文本

JSFIDDLE 演示

var allTds = $('table tbody td');
for(i=0;i<allTds.length;i++)
{
   trimmedText= allTds.eq(i).text();
   allTds.eq(i).text(trimmedText)
}

要获得宽度宽度，您可能不需要

var firstRowTds = $('table tr').eq(0).children();
for(i=0;i<firstRowTds.length;i++)
{
   alert(firstRowTds.eq(i).width()); // column width
}
于 2013-10-17T06:10:32.020 回答
0 
$(document).ready(function(){
    var width = $("table td:eq(0)").width();
    console.log(width);
})
于 2013-10-17T05:18:27.713 回答
0

我想，你必须使用$.trim() 之类的，

$('table tbody td').each(function(){
   console.log($(this).width()); // to get the column width
   trimmedText= $.trim($(this).text());
   $(this).text(trimmedText)
});
于 2013-10-17T05:19:05.177 回答