jQuery页面导航-在新页面中的节上设置活动类

<ul>
  <li id="home"><a href="home.html">Home</a></li>
  <li id="about"><a href="about.html">About</a></li>
  <li id="services"><a href="services.html">Services</a></li>
  <li id="contact"><a href="contact.html">Contact</a></li>
</ul>

$(document).ready(function() {
  // 获取当前页面的文件名
  var currentPage = location.pathname.split("/").slice(-1)[0];

  // 根据当前页面的文件名，为对应的导航项添加活动类
  $("#" + currentPage.split(".")[0]).addClass("active");
});

.active {
  background-color: #f00;
  color: #fff;
}