Question

我有一个html页面，其中包含表格标题的表格。如果在加载文档时没有包含任何行，我想在加载时删除该表。请注意，我不想点击或任何其他事情。

<table class="Example:">
<th>Range from 12.12 to 1.12</th></table>
<table class="Range:">
 <th>Range from109.091to111.364</th>  <tr><td>f88c6441-3a2f-4c63-8b00-f63a75c09d57</td>
  <td class="number">110.000</td></tr>
</table>

我想删除第一个表并保留第二个表。请注意，可以存在动态数量的此类表格

Answer 1

您遗漏了tr之外的th元素。

您可以获取表格的行数，如果大于1（首先是标题），则隐藏表格。

代码：

var rowCount = document.getElementsByClassName('Example')[0].rows.length;

if (rowCount<=1){
     document.getElementsByClassName('Example')[0].style.display = 'none';
}

演示：http://jsfiddle.net/IrvinDominin/HLv9c/

Answer 2

使用jQuery：

$("table:not(:has(td))").remove();

Get all elements without child node in jQuery

Javascript：

var table = document.getElementsByTagName("table");

for (var i = 0, a = table[i]; i < table.length; i++, a = table[i]) {
    if (a.getElementsByTagName("td").length === 0) {
        a.parentElement.removeChild(a);
    }
}

演示：http://jsbin.com/vuzin/1/edit

Answer 3

使用jquery：

<script>
  $(document).ready(function(){
    $('table').each(function(){
      if($(this).find('td').length <= 0){
         $(this).remove();
       }
    });
  });
</script>

删除HTML中没有行的表

3 个答案: