Capturing all the click event

Question

I am thinking of to add a javascript function to capture all the click events inside a html page.

So I am adding a global function that govern

Answer 1

your idea to delegate the event to the window and then check if the "event.target" is a link, is one way to go (better would be document.body). The trouble here is that it won't work if you click on a child node of your element. Think:

I am bold

the target would be the element, not the link. This means checking for e.target won't work. So, you would have to crawl up all the dom tree to check if the clicked element is a descendant of a element.

Another method that requires less computation on every click, but costs more to initialize would be to get all tags and attach your event in a loop:

var links = Array.prototype.slice.call(
    document.getElementsByTagName('a')
);

var count = links.length;
for(var i = 0; i < count; i++) {
    links[i].addEventListener('click', function(e) {
        //your code here
    });
}

(PS: why do I convert the HTMLCollection to array? here's the answer.)