динамически добавлять класс к элементу меню с помощью jquery

Question

Как добавить активный класс к тегу «li», а не к тегу «a». мой код:

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);