如何在侧边栏中为 ACTIVE URL 添加类？

Question

My code:

const address = location.pathname;
const links = document.querySelectorAll('.sidebarMain a');

links.forEach(function(el) {
 if(new RegExp(`^${el.getAttribute('href')}(.*)$`, 'i').test(address))
el.classList.add('active')});

But it doesn't work, where did I go wrong?

Answer 1

The HREF of links will automatically include the current domain when accessing via javascript, so you can just directly compare to window.location.href

 let links = document.querySelectorAll(".sidebarMain a"); let cur = window.location.href; console.log(cur) links.forEach(function(link){ if(link.getAttribute("href") == cur){ link.classList.add("active"); } });

 .active{font-weight:bold;color:red;}

 <div class="sidebarMain"> <a href="https://stacksnippets.net/js">Active</a> <a href="aaa">test3</a> </div>