I'm not a fan of appendTo, in a case like this to me it looks like
reading code backwards, rather than nicely nesting.
Ok, this does work:
var list = ['foo', 'bar', 'baz'];
var ul = $('#myul');
list.forEach(function(data) {
ul.append($('<li/>')).text(data);
});
The extra $() call isn't bad, it's short enough, I just don't want to do
a long "ul.append(document.createElement('li'))...." each and every time
I insert a single dom node.
As for using .each, I do know about that. However I'm not a fan of using
a jQuery method for iterating over data. I prefer sticking with the
native JavaScript 1.6/1.8 methods and tossing in compatibility for the
browsers without them.
Only reason I would possibly use jQuery to iterate over an array of
data, is if jQuery offered a method similar to my framework's .load
method. (actually it would be nice if jQuery also supported something
like my .nest)
pf('#foo').append('li').nest(function()
{
this.text('...');
this.append('img', {src:...}).click(function()
... do stuff ...
if(somecondition) this.addClass('foo');
});
pf('#myli').load([{name:'foo'}, {name:'bar', class: 'out'}, {name:'baz'}],
function(data) {
this.text(data.name);
if(class) this.addClass(class);
});
~Daniel Friesen (Dantman, Nadir-Seen-Fire) [http://nadir-seen-fire.com]
-Nadir-Point (http://nadir-point.com)
-Wiki-Tools (http://wiki-tools.com)
-MonkeyScript (http://monkeyscript.nadir-point.com)
-Animepedia (http://anime.wikia.com)
-Narutopedia (http://naruto.wikia.com)
-Soul Eater Wiki (http://souleater.wikia.com)
Renato Formato wrote:
> Daniel Friesen ha scritto:
>
>> So for that example:
>>
>> var list = ['foo', 'bar', 'baz'];
>> var ul = pf('#myul');
>>
>> list.forEach(function(data) {
>> ul.append('li').text(data);
>> });
>>
>>
>> So the question is, "How does one do something like this in jQuery?"
>>
>
> var list = ['foo', 'bar', 'baz'];
>
> $(list).each(function(i,data) {
> $("<li>").appendTo('#myul').text(data);
> });
>
> The key is the appendTo function, in order to keep the appended element
> the chainable object, on which call the text function.
>
> Note also the use of each with an array to iterate it.
>
> Hope this helps.
>
> Renato
>
> >
>
Kelvin Luck wrote:
>
>> Hi,
>>
>> I think:
>>
>> ul.append('li').text(data);
>>
>> Should be written as:
>>
>> ul.append($('li').text(data));
>>
>> Or does that qualify as "being required to run another method"?
>>
>> Hope it helps,
>>
>> Kelvin :)
>>
>
> I mean:
>
> ul.append($('<li />').text(data));
>
>
> --~--~---------~--~----~------------~-------~--~----~
> You received this message because you are subscribed to the Google Groups
> "jQuery Development" group.
> To post to this group, send email to [email protected]
> To unsubscribe from this group, send email to
> [email protected]
> For more options, visit this group at
> http://groups.google.com/group/jquery-dev?hl=en
> -~----------~----~----~----~------~----~------~--~---
>
>
--~--~---------~--~----~------------~-------~--~----~
You received this message because you are subscribed to the Google Groups
"jQuery Development" group.
To post to this group, send email to [email protected]
To unsubscribe from this group, send email to
[email protected]
For more options, visit this group at
http://groups.google.com/group/jquery-dev?hl=en
-~----------~----~----~----~------~----~------~--~---