jquery - 选择父列表的子菜单而不是子列表

Question

我们如何只从父列表项中选择子菜单而不从子列表项中选择子菜单？

我有第一个 ul 的顶级菜单 ID。在里面我有很多 li 和 ul(类子菜单)。在子菜单中，我有不同的 li，它也有相同类别(子菜单)的 li。

这是结构

   <div id="#top-menu">
      <li>
         <ul class="sub-menu">  //need to select this only
            <li>
               <ul class="sub-menu"> // Not this
            </li>
      </li>
      <li></li>
       <li></li>
         <ul class="sub-menu">
            <li></li>
               <ul class="sub-menu">
      <li></li>
      <li></li>
      <li></li>
   </div>

Answer 1

正如我在上面评论的那样，这里是您可以使用的选择器(在更正您的标记之后):

$("#top-menu > li > ul.sub-menu").css('border', '1px solid #000');

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="top-menu">
  <li>
    <ul class="sub-menu" style="border :1px solid red"> //need to select this only
      <li>
        <ul class="sub-menu" style="border :1px solid red"> // Not this

        </ul>
      </li>
    </ul>
  </li>
  <li></li>
  <li></li>
  <ul class="sub-menu">
    <li></li>
    <ul class="sub-menu">
      <li></li>
      <li></li>
      <li></li>
    </ul>
  </ul>
</div>