Recently, I started getting away from the jQuery pattern of checking the
length of an object before writing code. Instead, I've found myself wrapping
my selector in jQuery's
each method, and writing my code inside the
For example, instead of this:
if lengthvar target = ;// Do something with target and its childrentarget;// etc.
I've been writing this:
This has several advantages.
ifstatement are actually retained outside of the if statement. Using a function with
eachmeans variables declared in the function stay in the function.
Multiple elements handled properly: Even if I think that there's only one element with class
.target, I'm protected from failing code if there are more. Multiple
.targets will work just as well as a single one in this case, even to the point that each gets its own set of locally scoped variables.
Handles the no-element case: In the first code snippet, I explicitely test to see if the element exists before running the code. This is a good thing because a script file is often loaded on every page, but
.targetmay only be on a few of those pages. The second code snippet also handles the situation that
.targetdoes not exist on a given page just as well.
While it may be odd to see an
each block when only expecting a single item,
each-scoping method works as well as or better than the
method, and is just as short to write. It's a win in my book.