Demo JavaScript

by anandhinava

HTML

<button>For Demo</button>
<button>Test</button>

CSS

button {
    display:block;
    margin: 1em;
}

JavaScript

var $buttons = $("button");
var handler = {
    printfStyle: function () {

        console.log("name: %s, value: %dwon", "Melon", 8000);
        console.log("buttons: %o", $("button"));

    },
    byType: function () {

        console.info("info msg");
        console.warn("warning msg");
        console.error("error msg");

    },
    assert: function () {

        console.assert(1 === 0, "1 must be 1.");

    },
    trace: function () {

        console.trace();

    },
    group: function () {

        console.group();
        console.log("A");
        console.log("B");
        console.log("C");
        console.groupEnd();

    },
    groupCollapsed: function () {

        console.groupCollapsed("groupA");
        console.log("A");
        console.log("B");
        console.log("C");
        console.groupEnd();

    },
    profile: function () {

        console.profile("css bolding");
        $buttons.css('font-weight', 'bold')
            .data('foo', 'bar');
        console.profileEnd("css bolding");

    },
    time: function () {

        console.time("timerA");

        setTimeout(function () {

            console.timeEnd("timerA");

        }, 100);

    }
};

$buttons.click(function () {
    debugger;
    var name = $(this).text();

    console.log("[%s]", name);

    handler[name]();

});