所以,我有一个基本页面,我需要在其中突出显示我的用户所在的位置。得到了 ul > li > a
的导航我的想法是获取当前页面的URL,并与一个“a”的特定href进行匹配。
结构:
<header>
<a href="#" id="toggle-nav"><span class="trigger"></span></a>
<nav>
<ul id="nav-top">
<li><a href="../Index/Index.html" title="Home">Home</a></li>
<li><a href="#" title="#">Aluno</a>
<ul class="sub-menu">
<li><a href="../Index/areadoaluno.html" title="Area do Aluno">Area Do Aluno</a></li>
<li><a>sub-item</a></li>
<li><a>sub-item</a></li>
</ul>
</li>
<li><a href="#">Json</a>
<ul class="sub-menu">
<li><a href="Json.html" title="Teste Json">Json Teste</a></li>
<li><a>sub-item</a></li>
<li><a>sub-item</a></li>
</ul>
</li>
</ul>
</nav>
</header>
还有带有 javascript 的 jquery(可以将这两个家伙混合在一起吗?):
var url = window.location.pathname.split( '/' );
var i;
var location = "";
for(i = 0; i < url.length; i++)
{
location += url[i];
}
$('#nav-top a').each(function(){
var href = $(this).attr('href');
if( location.indexOf(href) > -1 )
{
alert("Yes!");
}
});
});
我正在研究 Jquery 和 jscript,所以我有点新,我正在研究一种解决方案,可以找到我的 url 的一部分并将其与特定的 href 匹配,与 url 的大小和我去的地方无关。
最佳答案
工作中jsfiddle
我认为你可以按照所示的方式进行操作。无需循环 url
,也无需额外的变量 location
。
var url = window.location.pathname.split('/');
$('#nav-top a').each(function() {
var href = $(this).attr('href');
if (url.indexOf(href) > -1) {
alert("Yes!");
}
});
是的,混合 jQuery 和 JS 是完全可以的。 jQuery 是一个 JS 库,因此它就是为此而生的
关于javascript - Jquery/Javascript 解决方案 URL 匹配 Href 然后添加一个类,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/37996328/