Dojo: The Definitive Guide

Creating NodeList Extensions

While the built-in methods for NodeList are quite useful, it's not going to be long before you'll find that there's this one method that you could really benefit from having on hand. Fortunately, it takes very little effort to inject your own functionality into NodeList. Consider the following use case accomplished via query that returns the innerHTML for each element of a NodeList :

dojo.query("p").map(function(x) {return x.innerHTML;});

Compared to working up that solution from scratch, you already have a really concise solution, but you could go even further to simplifying matters by using the even more concise String-as-Function syntax with the following improvement:

dojo.query("p").map("return item.innerHTML;"); //Used the special item identifier

That's definitely an improvement—would you believe that your code could still be even more readable and concise ? Consider the following extension to NodeList, in which you embed the mapping inside of a more readable and elegant function call that is very intuitively named so that it's completely obvious exactly what is happening:

//Extend NodeList's prototype with a new function
dojo.extend(dojo.NodeList, {
    innerHTML : function(  ) {
        return this.map("return item.innerHTML");
    }
});


//Call the new function
dojo.query("p").innerHTML(  );

What's great about extending NodeList is that for a very little bit of planning up front, you can significantly declutter your design and make it a lot more maintainable at the same ...