Glad you like the [].join('') trick, Howard - and good catch on the unnecessary
wrapper. You didn't miss anything, and that
simplifies the example down to:
$('#exampleCA').append( [
'<table style="width:718px;border:2px inset #336699">',
'<tr class="exampleRow">',
'<td style="text-align:center;color:white;">',
'I was created by jQuery append',
'</td>',
'</tr>',
'</table>'
].join('') );
One other thing I like about this approach is that - unlike the + concatenation
operator - the comma operator has lower precedence
than the ? : conditional operator and the || and && logical operators. So you
can write code like this:
var html = [
'<div>',
name ? name : 'no name',
'</div>'
].join('');
You could do that with string concatenation, but it would require parenthesis
around the conditional expression, which adds a bit of
ugliness.
You're right on the appendTo vs. append question too - the docs need to be
updated. Check the source code:
jQuery.each({
appendTo: "append",
prependTo: "prepend",
insertBefore: "before",
insertAfter: "after",
replaceAll: "replaceWith"
}, function(i,n){
jQuery.fn[ i ] = function(){
var a = arguments;
return this.each(function(){
for ( var j = 0, al = a.length; j < al; j++ )
jQuery(a[j])[n]( this );
});
};
});
appendTo is just a wrapper around append - just like prependTo, etc. And all of
these functions run their arguments through
domManip(), which is the code that handles the text vs. DOM element question.
I wouldn't assume that any jQuery function that takes a string will also take
DOM elements or jQuery objects, but for this group of
functions it's certainly true.
-Mike
> From: howardk
>
> Nice use of join()! I'm new to JavaScript and jQuery both,
> and it's nice to come across little snippets like this I can
> readily add to my jQuery repetoire and that slightly expand
> my understanding of JavaScript.
>
> By the way, the docs show that it's legal to pass, as an
> argument to append(), either a jQuery object (as you're
> doing), a DOM element, or a string. So you really don't need
> to wrap the stringified array in a jQuery object before you
> pass it in. Unless there's another reason for doing so that
> I'm missing.
>
> Apropos to the above, I wonder why the docs for appendTo()
> show a string as being the only legal argument type? I tried
> a test passing in a jQuery object instead and it worked just
> fine. Does that mean you can use a jQuery object *any* time a
> string is called for in other jQuery methods as well? Or just
> a case of the documentation needing to be adjusted in this one case?
