时间戳

首页 > 解决方案 > 如何在html表中查找父行是否有子行

html - 如何在html表中查找父行是否有子行

问题描述

我有以下不完整的代码：

if (tr.attr('data-depth') == 0 && **tr.children()** {                    
}

上面标出的双星是不完整的。 在上面的代码中，我想要实现的是检查父行（我正在通过检查 tr.attr('data-depth')==0）检查该父行是否有任何子行以及是否该父行没有子行，然后删除我在花括号之间做的自定义类。

如何达到同样的效果？任何代码示例都会非常有帮助。

标签： htmljqueryhtml-tabletablerow

解决方案

您可以检查父行是否有任何作为子行的行，find('tr')并检查是否找到了任何内容.length

此代码是一个示例。您可以根据需要对其进行修改。

$('tr[data-depth = 0]').each(function(){
  if( $(this).find('tr').length > 0)
    $(this).css('background-color','red')
})
table, th, td {
  border: 1px solid black;
  border-collapse: collapse;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<table>
    <tr data-depth = 0>
        <td>
            <table>
              <tr>
                <td>
                1
                </td>
              </tr>
              <tr>
                <td>
                2
                </td>
              </tr>
            </table>
        </td>
    </tr>
    <tr data-depth = 0 >
        <td>
            3
        </td>
    </tr>
    <tr>
        <td>
            4
        </td>
    </tr>
</table>

为了更容易表达，您必须选择您的确切tr元素

let my_row = // Your target row
if( $(my_row).data('depth') == 0 && $(my_row).find('tr').length > 0)
{
 // Do something
}

推荐阅读