jquery - 如果它与当前 url 匹配，则将类添加到当前链接？

Question

我正在使用这个脚本来突出显示当前链接(添加事件类):

<script type="text/javascript">
jQuery(document).ready(function( $ ) {
$(function() {
  $('nav a[href^="/' + location.pathname.split("/")[1] + '"]').addClass('active');
});
});
</script>



<li><a href="/category/english/this/?s=<?php
echo '' . htmlspecialchars($_GET["s"]) . '';
?>/">this</a></li>

<li><a href="/category/english/that/?s=<?php
echo '' . htmlspecialchars($_GET["s"]) . '';
?>/">that</a></li>

这首先匹配 / ，例如 /category , 然后突出显示菜单中的所有内容或以 /category/... 开头的任何链接.我要全部匹配到三级1/2/3/whatever ，所以如果我在 url 上:/category/english/that/?s=what is this , 我想要包含 /category/english/that/ 的链接突出显示。

Answer 1

可能您不需要拆分 location.pathname。尝试

let pathname = '/category/english/this';
$(function() {
  $('ul a[href^="' + pathname + '"]').addClass('active');
});

.active {
  color: red
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<ul>
  <li><a href="/category/english/this/?s=text">this</a></li>
  <li><a href="/category/english/that/?s=text2/">that</a></li>
</ul>