- Train of Thoughts - http://trainofthoughts.org/blog -

jQuery Debugging Plugin

Posted By Ralf S. Engelschall On Friday, March 16, 2007 @ 14:18 In Hacking,JavaScript | 21 Comments

Recently I was forced to debug my jQuery [1] hacks in Internet Explorer (IE). I got extremely tired of having to use the nasty JavaScript alert() function for debugging while in Firefox I can use the cool Firebug [2] plugin and its console.log() function. I thought Firebug is a Firefox/Firebug specific solution only.

But hey! There is a Firebug Lite [3], which comes to the rescue. It is a small emulation of Firebug and provides console.log() in IE, too. Great. But OTOH one now has to explicitly load the Firebug Lite stuff and for quick debugging an even small and minimal console.log() would be sufficient, too.

Additionally, I really want to combine console.log() and jQuery and use something like $('div#foo').log("some message about foo"), of course.

Features

This jQuery plugin provides the following main features:

  1. global jQuery method $.debug([true|false])
    This is the global jQuery method which can be used to get and set the flag which indicates whether
    debugging is enabled or not. The default is the value of the debug attribute of the <html> node or the value false.
  2. global jQuery method $.log(message)
    This is the global jQuery method for logging message to either Firebug, Firebug-Lite or the home-brewn minimum Firebug emulation console.
  3. jQuery object method $(…).log([message])
    This is the jQuery object method for logging the jQuery items in the jQuery object and optionally the message to either Firebug, Firebug-Lite or the home-brewn minimum Firebug emulation console.

Trivial Example

<div id="test1">TEST1</div>
<div id="test2">TEST2</div>
<script type="text/javascript">
    $("console.log").ready(function(){
        $.debug(true);
        $.log("plain debug message");
        $('#test1').log();
        $('#test2').log("with message");
    });
</script>

Download

This jQuery plugin can be downloaded from the File Repository [4] area.


Article printed from Train of Thoughts: http://trainofthoughts.org/blog

URL to article: http://trainofthoughts.org/blog/2007/03/16/jquery-plugin-debug/

URLs in this post:

[1] jQuery: http://jquery.com/

[2] Firebug: http://www.getfirebug.com/

[3] Firebug Lite: http://www.getfirebug.com/lite.html

[4] File Repository: http://trainofthoughts.org/repo/dirview?d=jquery

Copyright © Ralf S. Engelschall, All Rights Reserved.