ded / bonzo

library agnostic, extensible DOM utility
Other
1.32k stars 137 forks source link

$("ele").append() strips text in a mixed string. #105

Open envygeeks opened 11 years ago

envygeeks commented 11 years ago

Doing: $("<p>").append("<span>Here</span> Gone") Results in only <span>Here</span> being appended.

The above seems unintuitive to me. I am wondering if this could be considered a bug or if it's really intended to happen? If it's intended I was wondering if there was a rational reason this happens because it seems that we have to literally go out of our way when building with $("") it also means that if we want to continue to use $("") to build we must pull the $().html() and join it when trying to add multiple (seperately built) pieces to the element and then on the last part of the chain just use $("").html like below:

twt_paragraph.append(twt_anchor);
twt_ele.html(twt_paragraph.html(twt_paragraph.html()+link_users(tweets[i].text)));

According to Ender and the DOM I have "0.4.3-dev".

ded commented 11 years ago

upgrade!! :+1: we are at 1.3.1 https://github.com/ded/bonzo/blob/master/package.json#L4

you could probably also use an Ender upgrade if you haven't done that in a while too.

npm install ender -g

then go into your working bonzo package...

ender refresh

best of luck

envygeeks commented 11 years ago

Sorry I read the version string wrong (I read it from the DOM because I deleted the node_modules folder and all that) so I rebuilt and retested (without upgrading) and I was actually using 1.3.1 so this issue is against 1.3.1 not the version I listed.

On a side note the _VERSION in $ and ender says "0.4.3-dev" for some reason.

ded commented 11 years ago

cc @rvagg

rvagg commented 11 years ago

I'm not sure what we should do about this. The behaviour is definitely intended, we internally do a check for nodeType == 1 in create() and only return created elements for which that is true. If we expanded it to text nodes (nodeType == 3) then we'll end up with all sorts of weird behaviour:

bonzo.create('<p>foo</p> <span>bar</span>')
 // -> [ '<p>foo</p>', ' ', '<span>bar</span>' ]

i.e. 3 elements, the middle one a text node. Currently create() will skip over that element for the return list.

Which is the same thing that would happen for the manipulation methods that return the created elements: appendTo(), prependTo(), insertBefore(), insertAfter().

I'm personally just in favour of saying that if you really want to create/append text nodes then you should be wrapping them in something else. But I know that may not be the ideal solution for others.