Блог

У меня есть боковая навигация, которая импортирует полную навигацию сайта, и я хотел бы сократить ее только до дочерних ссылок текущего раздела. Структура такая:

 <div class="sidebarLinks">
<ul>
    <li> <!-- MAIN NAV SECTION -->
        <a href="#" id="MainA">MainA</a>
    </li>
    <li> <!-- MAIN NAV SECTION -->
        <a href="#" id="MainB">MainB</a>
        <ul>
            <li><a href="#" id="B-A">B-A</a></li>
            <li><a href="#" id="B-B">B-B</a></li>
            <li><a href="#" id="B-C">B-C</a></li>
        </ul>
    <li>
    <li> <!-- MAIN NAV SECTION -->
        <a href="#" id="MainC">MainC</a>
        <ul>
            <li><a href="#" id="C-A">C-A</a></li>
            <li><a href="#" id="C-B">C-B</a></li>
            <li><a href="#" id="C-C">C-C</a></li>
        </ul>
    <li>
</ul>
</div>
  

Итак, если я нахожусь на B-A, я хочу видеть B-A, B-B и B-C в боковой навигации, но не MainB или любые другие ссылки. Я пробовал следующее, но оно возвращает второй дочерний элемент каждого основного раздела навигации (B-B, C-B и т.д.):

 $(".sidebarLinks ul li:nth-child(2)").children().show();
  

Мы высоко ценим любые советы. Спасибо.

 $(".sidebarLinks > ul > li:nth-child(2) > *").show();
  

Селектором дочерних элементов jQuery является символ «>». Вы также можете сохранить вызов .children() с помощью «> *», поскольку это приведет к получению любого элемента, являющегося дочерним элементом n-го li.