Question

我有两个导航。一个有<ul id="menu-topmenu"></ul>，第二个有<ul id="sidebar-menu"></ul>我需要找到这个id =“menu-topmenu”，但我不知道怎么做？有什么建议吗？这是我的导航：

<nav>

<div class="menu-topmenu-container">
  <ul id="menu-topmenu" class="menu">
    <li id="whats-on" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-53"><a href="#whatson">What’s On</a></li>
    <li id="menu-item-52" class="menu-item menu-item-type-post_type menu-item-object-page current-menu-item page_item page-item-10 current_page_item menu-item-52"><a href="#" class="active">Visiting Us</a></li>
    <li id="menu-item-46" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-46"><a href=#">Collections &amp; Research</a></li>
    <li id="menu-item-50" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-50"><a href="#">Learning</a></li>
    <li id="menu-item-49" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-49"><a href="#">Get Involved</a></li>
</ul>

这是我的剧本：

$(function() {
  var href = window.location.href;
  $('nav a').each(function(e,i) {
    if(this.parentNode.id.indexOf('menu-topmenu') != -1){
            $(this).addClass('active');

    }
    else if(href.indexOf($(this).attr('href')) >= 0) {
          $(this).addClass('active').append('<i class="fa fa-angle-right" style="margin-left:5px;"></i>');
    }

  });
});

Answer 1

点击主播的parentNode是列表项，因此代码会尝试在父id上查找特定的li，但不存在。相反，您可以使用.closest()在DOM中遍历以查找特定ID。

您必须使用.closest()来遍历：

$(function() {
  var href = window.location.href;
  var $link = $('nav a[href*="' + href + '"]');

  $link.toggleClass('active', $link.closest('#menu-topmenu').length !== 0);

  if ($link.closest('#menu-topmenu').length == 0) {
    $link.append('<i class="fa fa-angle-right" style="margin-left:5px;"></i>');
  }
});

Answer 2

试试这个：

var loc = window.location.pathname;

$('nav').find('a').each(function() {
   $(this).toggleClass('active', $(this).attr('href') == loc);
   $(this).append('<i class="fa fa-angle-right" style="margin-left:5px;"></i>');//for adding symbol
});

如何为特定的ul id添加图标和活动类？

2 个答案: