Javascript 如果列表项有子列表，则添加css样式

我有一个ul的导航，见下文：

<nav>
<ul>
    <li><a href="#">Top Link 1</a></li>
    <li><a href="#">Top Link 2</a></li>
         <ul>
           <li><a href="#" >Sub Link 1</a></li>
           <li><a href="#">Sub Link 2</a></li>
           <li><a href="#">Sub Link 3</a></li>
        </ul>
    </li>        
    <li><a href="#">Top Link 3</a></li>
        <ul>
           <li><a href="#" >Sub Link 1</a></li>
           <li><a href="#">Sub Link 2</a></li>
           <li><a href="#">Sub Link 3</a></li>
        </ul>
    </li>
</ul>
</nav>

我有我的css，隐藏子链接的“ul”，除非将鼠标悬停在父“li”上。（除非询问，否则不会显示，因为这不是问题所在）

我试图使用JQuery将css样式（margin-bottom:30px；）添加到顶层“li”中，前提是它嵌套了一个子“ul”。我的JQuery如下所示：

<script>
$(document).ajaxSuccess(function () {

    if ($("nav ul >li").children("ul li")) {
        $("nav ul >li").hover(function () {
            $("nav ul >li").css("margin-bottom", "30");
        });

    }
});
</script>

$（文档）.ajaxSuccess（函数（）{
如果（$（“nav ul>li”）。儿童（“ul li”））{
$（“导航ul>li”）。悬停（函数（）{
美元（“nav ul>li”）.css（“保证金底部”、“30”）；
});
}
});

---

这似乎对我不起作用，有人能指出我做错了什么吗？或者他们能为这种方法提供更好的解决方案吗？

。子项总是返回一个数组，请选中
.length

$(document).ajaxSuccess(function () {
    if ($("nav ul >li").children("ul li").length > 0) {
        $("nav ul >li").hover(function () {
            $("nav ul >li").css("margin-bottom", "30");
        });

    }
});

试试这样的小动作：

$('li > ul').each(function(){
  $(this).parent().addClass("your class");
});

这将选择所有li的子对象，并将该类应用于尊敬的li。
.children（）
方法返回一个对象，并且该对象在JavaScript中是一个真实值，如果条件被赋值为true，您正在将侦听器添加到所有
li
元素，而不仅仅是那些具有
ul
子元素的元素，您可以使用作为筛选方法的
.has（）
方法：

$("nav > ul > li").has('ul').on({
    mouseenter: function() {
      $(this).css("margin-bottom", "30px");
    },
    mouseleave: function() {
      $(this).css("margin-bottom", "n");
    }
});

或：

你的问题中确实有一个额外的
，我认为这是一个打字错误

<li><a href="#">Top Link 2</a></li>
                     //-------^^^^^here
     <ul>
       <li><a href="#" >Sub Link 1</a></li>

我还建议你看一下傻瓜鱼的菜单。尽量避免在javascript中设置样式，而使用css。请看，您有一个额外的
结束标记，它正在更改您的DOM树。如前所述，没有一个
ul
是
li
的孩子。好吧，现在哪里是代码，哪里是解释，没有解释为什么它对OP.LOL不起作用。很高兴看到人们在自己做得不对的情况下演讲D@PSL仔细观察，这将选择所有属于李的孩子的uls，并将课程应用于尊敬的李。
<li><a href="#">Top Link 2</a></li>
                     //-------^^^^^here
     <ul>
       <li><a href="#" >Sub Link 1</a></li>

$(document).ajaxSuccess(function () {
if ($("nav ul >li").children().length > 0) {
    $("nav ul >li").hover(function () {
        $(this).css("margin-bottom", "30");
    });

}
});