Prevent href=”#” from appending ‘#’ to address bar with JavaScript

Sometimes a link’s href attribute is set to ‘#’ so that the link does nothing and instead the behavior can be controlled by JavaScript. However the ‘#’ will be applied the URL within the address bar and cause the page to load or jump to the top. This checks for all links set to ‘#’ and applies preventDefault()

JavaScript

// **************************************************
//  Prevent href="#" from appending '#' to address bar
// **************************************************
document.querySelectorAll('a[href^="#"]').forEach((anchor) => {
    anchor.addEventListener('click', (event) => {
        event.preventDefault();
    });
});