javascript - 如果没有 child ，则针对特定元素

Question

一些我认为相当简单的事情让我很头疼。

我正在尝试检查某个元素是否有子元素，如果没有子元素我想更改下一个元素的 css <i>对于那个特定的实例。

我已经设法让脚本删除所有 <i>元素，但它应该只从那些没有找到子元素的实例中删除它。

我通常设法让我的 jquery 通过大量的试验/错误工作，但是对于这个我在黑暗中，即使它不是很困难。它一定是我在这里遗漏的相当简单的东西。

$( document ).ready(function() {
    if ($('nav ul li').find('ul').length = 0) {
        $(this).next('i').css('display','none')
    }
});

HTML

<ul>
  <li>
    <input type="checkbox" checked>
        <a href="#"><i class="fa fa-chevron-down"></i>prime 1</a>
 </li>
 <li>
    <input type="checkbox" checked>
        <a href="#"><i class="fa fa-chevron-down"></i>prime 1</a>
              <ul>
                <li><a href="#">sub 1</a></li>
                <li><a href="#">sub 2</a></li>
              </ul>
 </li>

Answer 1

因为 if block 中的 this 没有引用 li 元素。

你可以使用 .not() 过滤器方法和 :has() 来做这件事

$(document).ready(function() {
  $('nav ul li').not(':has(ul)').next('i').css('display', 'none');
});

注意:我认为还有另一个问题，因为 i 不能是 li 元素的兄弟元素