jQuery

jQuery in Firebug: How and why?

There are a number of folks out there who use the Firebug extension for FireFox so they can debug webpages. Firebug also includes a Javascript console so you can execute arbitrary Javascript code against the current page.

If you're a fan of the jQuery library, there's a way you can use that in Firebug (first documented here):

var j = document.createElement("script");
j.onload = jsCallback;
j.src = "http://code.jquery.com/jquery-latest.pack.js";
document.getElementsByTagName("head")[0].appendChild(j);

Note that line I have in bold? That fires a function called "jsCallback()" after jQuery is successfully loaded.

"Why a fancy callback?"

As I learned the hard way, if I were to just put Javascript code following the jQuery code, it might get executed before jQuery is successfully loaded, leading to errors. While I could just re-run the code (as jQuery would already be loaded), I was looking for a better solution to the problem, and this is what I came up with.

"So what can I do this callback?"

I'm glad you asked. One way using jQuery in Firebug comes in quite handy is if you want to dissect another web page. For example, let's say you want to run a Google search, and extract the URLs in the search results. Here's how to do it:

/**
* This is executed after jQuery is successfully loaded.
*/
function jsCallback() {

    var e = jQuery("a.l");

    var output = "";
    e.each(function() {
        output += jQuery(this).attr("href") + "\n";
    });

    alert(output);

}

var j = document.createElement("script");
j.onload = jsCallback;
j.src = "http://code.jquery.com/jquery-latest.pack.js";
document.getElementsByTagName("head")[0].appendChild(j);

"I could write $.get() calls to load Google's search results!"

Good luck with that. FireFox won't let you do that due to the same-origin policy.

"Well, how about if I get Google's search results in JSONP format?"

Um, good luck with that, too. You won't get very far without an HTTP referrer header, I'm afraid.

"So if I want to do this on an ad-hoc basis, I have to dissect the Google search results page?"

Yep, exactly.

Got any other tricks you find really useful to do with jQuery in Firebug? Let me know in the comments! 
 

0
No votes yet
Your rating: None

Open Source Software I've Written

This part of the site contains software that I have written over time. Everything here is available under the Gnu Public License (GPL).

Newer stuff:

  • Fivestarstats- This is an add-on for Drupal's Fivestar module. It generates reports of the following stats:
    • Top Voters by IP
    • Top 1-star Voters by IP
    • Lower Vote Average by IP
    • Top-rated Users
    • Top # of Posts/Comments
    • Most 1-star Votes Received
    • Bottom-rated Users
  • Anthrocon Webform - An add-on to Drupal's Webform module. It provides a tab-delimited download for webform submissions that presents multi-selects as comma-delimited lists instead of separate fields. Very handy for fields that have 10 or more options to choose from!
  • Anthrocon Dealers - This is an add-on for Drupal's Ubercart module. It provides reports to our Dealers Room staff of who purchased Dealers Room tables for our convention.
  • Anthrocon-reg - The pre-registration and on-site registration system for Anthrocon. This software, written as a Drupal module, accepts credit cards at pre-registration, talks to Authorize.net, and drives CR-80 badge printers at on-site registration. Works well under LAMP or WAMP.
  • Doug's Drupal Tools - I had a few things I wanted to add into Drupal, so I added them. :-) This Drupal module increases logging of certain events, and integrates with the Flag module and Privatemsg module. I use this module on some websites I run.
  • Doug's Drupal Templates - A series of user and page templates for Drupal that I wrote. They contain support for social networking sites (Facebook, Twitter, etc.), and instant messenger support in both user profiles and forum posts. I also use this module on some websites I run.

Older stuff:

  • My Drupal Patch page - I've gotten into Drupal lately, so I've written a bunch of patches for bugs that I found in some of its modules. You can find them here.
  • My Drupal Modules page - Now I've begun writing modules for Drupal. They can all be found here.
  • Older Software I've Written - In years past, I've had the occasional need for a utilty that didn't exist, so I'd write it. This page holds those utilities.
0
No votes yet
Your rating: None
Syndicate content