javascript - 仅当使用 jQuery 或 Javascript 在 HTML 中有数据时才在 html 中显示 <td> 边框？

Question

我有一个像这样的 HTML 表格:

<table class="table table-bordered">  
    <thead>  
        <tr>  
            <th>Tag</th> 
            <th>Time Code</th>  
        </tr>  
    </thead>  
    <tbody>  
        <tr>  
            <td>{{ choice.tag1 }}</td>
            <td>{{ choice.time_code1 }}</td>                    
        </tr>  
        <tr>  
            <td>{{ choice.tag2 }}</td>
            <td>{{ choice.time_code2 }}</td>                    
        </tr>  
        <tr>  
            <td>{{ choice.tag3 }}</td>
            <td>{{ choice.time_code3 }}</td>                    
        </tr>  
        <tr>  
            <td>{{ choice.tag4 }}</td>
            <td>{{ choice.time_code4 }}</td>                    
        </tr>  
        <tr>  
            <td>{{ choice.tag5 }}</td>
            <td>{{ choice.time_code5 }}</td>                    
        </tr>  
        <tr>  
            <td>{{ choice.tag6 }}</td>
            <td>{{ choice.time_code6 }}</td>                    
        </tr>  
        <tr>  
            <td>{{ choice.tag7 }}</td>
            <td>{{ choice.time_code7 }}</td>                    
        </tr>  
        <tr>  
            <td>{{ choice.tag8 }}</td>
            <td>{{ choice.time_code8 }}</td>                    
        </tr>  
        <tr>  
            <td>{{ choice.tag9 }}</td>
            <td>{{ choice.time_code9 }}</td>                    
        </tr>  
        <tr>  
            <td>{{ choice.tag10 }}</td>
            <td>{{ choice.time_code10 }}</td>                   
        </tr>  
    </tbody>  
</table>  

我使用 {{}} 传递的变量大多数时候都是空的。即使它是空的 td 也会显示。我不会切断空间，也不显示任何 td(如果它们为空)。例如，有时我可能只拥有最多 3rd td 的数据，因此我只想显示最多 3rd td 的数据。使用 jQuery 或 JavaScript 可以实现这一点吗？

Answer 1

你可以尝试这个，也许会对你有帮助:

$(document).ready(function(){
  $(".table tbody td").each(function(){
    if($(this).html()=="")
      {
       $(this).hide();
      }
   });
});