博客列表 >js 实现导航高亮

js 实现导航高亮

深巷的博客
深巷的博客原创
2022年11月30日 17:23:46463浏览
  1. <script>
  2. // 获取所有导航a标签
  3. const links = document.querySelectorAll('nav a');
  4. // 获取当前URL路径信息
  5. const path = location.pathname + location.search;
  6. links.forEach(function(item) {
  7. //console.log(path);
  8. //console.log(item.getAttribute('href'));
  9. // 检索href是否存在匹配项并添加高亮class
  10. if (path.indexOf(item.getAttribute('href')) !== -1) {
  11. item.classList.add('active');
  12. }
  13. })
  14. </script>
声明:本文内容转载自脚本之家,由网友自发贡献,版权归原作者所有,如您发现涉嫌抄袭侵权,请联系admin@php.cn 核实处理。
全部评论
文明上网理性发言,请遵守新闻评论服务协议