I’ve been having a lovely day at work, fiddling with jQuery. I started to come up with some really gnarly selector chains though, and I wondered what nodes they were actually addressing.
So, I wrote a tiny jQuery extension that logs the current jQuery selection to the firebug console.
jQuery.fn.log = function (msg) {
console.log("%s: %o", msg, this);
return this;
};
Now, I can just stuff a call to .log() in the middle of what I’m doing to see what I’m currently addressing. e.g.
$(root).find('li.source > input:checkbox').log("sources to uncheck").removeAttr("checked");
The nice thing about logging to firebug is that each node becomes clickable in the console, so you can immediately see the context.
