Lo ideal sería generar esta clase desde el lado del servidor, pero si no puede …
Digamos que tiene una navegación como esta:
<nav>
<ul>
<li><a href="https://css-tricks.com/">Home</a></li>
<li><a href="http://css-tricks.com/about/">About</a></li>
<li><a href="http://css-tricks.com/clients/">Clients</a></li>
<li><a href="http://css-tricks.com/contact/">Contact Us</a></li>
</ul>
</nav>
Y estás en la URL:
http://yoursite.com/about/team/
Y desea que el enlace Acerca de obtenga una clase de “activo” para que pueda indicar visualmente que es la navegación activa.
$(function() {
$('nav a[href^="https://css-tricks.com/" + location.pathname.split("https://css-tricks.com/")[1] + '"]').addClass('active');
});
Básicamente, eso coincidirá con los enlaces en el navegador cuyo atributo href comience con “/ about” (o lo que sea que sea el directorio secundario).