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 :)
On Fri, 30 Jan 2009 13:44:08 -0800, Daniel Friesen
<[email protected]> wrote:
> What is the accepted method of dom manipulation in jQuery (creating and
> inserting new dom nodes).
>
> I can't seam to find a reasonably intuitive method of doing this using
> jQuery internals.
>
> A good example. Given a jQuery object which contains a ul tag. How would
> one insert a new li tag, and then insert some user specified *TEXT*.
> With emphasis on it being text, for the li, not some random html. The
> standard use case of this, is "given a ul tag and an array of data,
> inject a number of li tags containing that data".
>
> In my own framework at work the methods like append (while they do
> accept dom nodes and other objects) have the primary purpose of creating
> an injecting new nodes. The first argument to them is a tag name and
> they also accept an object of attributes.
>
> 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?"
> ((Btw: My framework does include a compatibility layer for the moz
> methods like forEach; I'd probably include those in any other work as
> well anyways))
>
> I noticed that jQuery's append does handle XHTML style input (and it
> parses it on it's own instead of going through innerHTML by the looks of
> it; a plus for me), however the following does not work as one might
> expect:
>
> var list = ['foo', 'bar', 'baz'];
> var ul = $('#myul');
>
> list.forEach(function(data) {
> ul.append('<li />').text(data);
> });
>
> That would be because the .append returns the object containing the ul
> not the new li.
>
> And note, I do not consider the following to be an acceptable robust
> method of manipulation; The data is user supplied so it shouldn't be
> inserted in a place where it could be considered html, it looks fairly
> unclean imho, and it does not extend past the simplest of acts because
> you still cannot use anything like .attr or whatnot to further
> manipulate the data:
>
> var list = ['foo', 'bar', 'baz'];
> var ul = pf('#myul');
>
> list.forEach(function(data) {
> ul.append('<li>'+data+'</li>');
> });
>
> Also being required to run another method just to chain with something
> you just created isn't an acceptable robust method. As well if I have to
> go calling document.createElement then there is little point in using
> jQuery for this in the first place.
>
>
> So is there another robust method I am missing, or any suggestions for
> robust methods which could be developed as improvements?
>
--~--~---------~--~----~------------~-------~--~----~
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
-~----------~----~----~----~------~----~------~--~---
