Single Event Handler for all events javascript/jQuery

Question

I know I can have one handler handle multiple events using jQuery like:

$('#myID').bind('blur mousedown mouseup focus', function (e) {}

Also, I can register an event from all elements using jQuery like:

$(document).on("click", "*", function(event) {
    console.log("Click");
});

I have two questions:

1. How do I register a single listener for multiple events in pure javascript?

2. Is there any way to have a single handler for all events in a document using JS or jQuery, like a master handler which will delegate the events to my other handlers?

I am looking at something like this:

$(document).on("*", "*", function(event) {
    console.log("I am the master handler...");
    // call delegates
});

Answer 1

This is the closest i can get by javascript: JSBIN-Demo

<input type="text" id="myText" />


var allEvents = ['focus','blur','mouseover','mousedown','mouseup','mousemove', 'click'];

function masterHandler(){
    var event = event || window.event;
    switch(event.type){
        case 'click':
            console.log('cliked');
            break;
        case 'mouseover':
            console.log('mouseover');
            break;
    }
}

function bindAllEvents(selector, handler) {
    var elements = document.querySelectorAll(selector);
    for(var i=0;i<elements.length;i++){
        for (var key in allEvents){
            elements[i].addEventListener(allEvents[key], handler, false);
        }
    }
}

bindAllEvents('*', masterHandler);