I used to have code that uses:
$(document).on('click', 'a[href^="http"]', () => {});
To intercept link clicks. For complicated-to-explain reasons, I had to move this code somewhere before jQuery is loaded. How can I write this code in pure JavaScript?
Base on the comments above, you can convert the event binding jQuery code above to something below using vanila JavaScript,
var links = document.querySelector('a[href^="http"]');
links.forEach(function(link) {
button.addEventListener("click",function(e){
// handling logic
}, false);
} )
Code above bind event handler to every a element which can be expensive.
Create an event delegate
Add an event handler to the document and see if the target is the link you want,
document.addEventListener("click", function(e) {
// check the target has an attribute of `a[href^="http"]`
if(e.target && e.target.nodeName == "a") {
}
});
Code above using event bubbling to catch click event inside the document.
