使用jquery动态地将类active激活到菜单项

Question

我如何添加＆＃34;活跃＆＃34;等到＆＃34; li＆＃34;标记不是＆＃34; a＆＃34;标签。 我的代码：

var url = document.URL;
$('#example li a[href="'+url+'"]').addClass('active');

Answer 1

Alertnative＃1 - 选择父项而不是子项

您可以使用:has()选择器。

var url = document.URL;
$('#example li:has(a[href="'+url+'"])').addClass('active');

---

备选方案＃2 - 使用遍历功能转到父

您可以使用.parent()函数（如果锚是列表项的直接子项）。

var url = document.URL;
$('#example li a[href="'+url+'"]').parent().addClass('active');

另一个更通用的选择是使用.closest()函数（即使锚不是列表项的直接子项，这也会起作用）。

var url = document.URL;
$('#example li a[href="'+url+'"]').closest("li").addClass('active');

Answer 2

使用parent功能。

var url = document.URL;
$('#example li a[href="'+url+'"]').parent().addClass('active');

Answer 3

假设html是这样的：

 <div id='example'>
    <li>
       <a></a>
    </li>
 </div>

Jquery代码：

 var url = document.URL;
     $('#example li a').parent('li').attr('class','active');
     $('#example li a').attr('href',url);