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 time.
The recommended practice for modularizing up this kind of
extension is to create a submodule called
ext-dojo with a resource file called
NodeList.js inside of it so that you end up with
a dojo.require
statement that is
crystal clear to whoever ends up reading your code. In the end, you
have a situation that's a win for everyone. Your final usage of the
extension might end up looking like the following example once you're
all finished with it:
/* ... * dojo.require("dtdg.ext-dojo.NodeList"); /* ...*/ dojo.query("p").innerHTML( );
Clearly, you could go as far as to name the resource file NodeList-innerHTML.js if you wanted to be pedantic; do whatever makes you most comfortable, so long as you are consistent.
Get Dojo: The Definitive Guide now with the O’Reilly learning platform.
O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.