Hi everyone,
I have been using FlyDOM, and am trying to convert some of that code
to use the jQuery append, after reading what Mike wrote about better
performance. I am trying to dynamically insert some attributes.
However I'm getting a syntax error, so I think I'm not understanding
something simple here on how the append/join syntax works. Here is an
example:
$($(this).parent()).append(["<p>","<input type='text'
class='"+inputClass+"'","<button onclick: '"+$
(this).parent().remove();return false;+"'","</p>"].join(""));
I get an: missing ] after element list error in Firebug. Any thoughts?
Thanks.
Matt
On Sep 29, 11:17 am, "Michael Geary" <[EMAIL PROTECTED]> wrote:
> > From: James Dempster
>
> > I've never really understood the point to FlyDOM. It seems
> > like a nice idea, but whats wrong with just using jQuery?
>
> > FlyDOM
> > $('#exampleCA').createAppend(
> > 'table', { width: '718px', style: 'border: 2px inset #336699;' }, [
> > 'tr', { className: 'exampleRow' }, [
> > 'td', { align: 'center', style: 'color: white;' },
> > 'I was created by createAppend()!'
> > ]
> > ]
> > );
>
> > jQuery
> > $('#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>'
> > ));
>
> > As far as I can tell both of these would do the same thing?
> > They're both as easy as each other, maybe jQuery is even
> > easier as it's plain html. Would the jQuery version be faster
> > also as it could just inject the html into the DOM using
> > something like innerHTML.
>
> Yes indeed, innerHTML is faster than DOM insertion, and you also remove the
> overhead of the code that interprets the element list.
>
> In fact, I wrote the first jQuery DOM plugin, and I don't use my own plugin
> any more!
>
> You can improve the speed even more by using [].join instead of string
> concatenation:
>
> $('#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('') ));
>
> In your simple test case it won't make any difference, but if you are
> stringing together a lot of HTML code, [].join will speed it
> up in most browsers.
>
> -Mike
