W3C home > Mailing lists > Public > public-webapps@w3.org > April to June 2012

Re: [webcomponents] Template element parser changes => Proposal for adding DocumentFragment.innerHTML

From: Tab Atkins Jr. <jackalmage@gmail.com>
Date: Fri, 11 May 2012 02:12:07 +0200
Message-ID: <CAAWBYDBJPd=KhsTLsU_EkQenxaWYoniJLcppDfJasj5W=zpyEg@mail.gmail.com>
To: Ian Hickson <ian@hixie.ch>
Cc: Rafael Weinstein <rafaelw@google.com>, Webapps WG <public-webapps@w3.org>
On Fri, May 11, 2012 at 2:03 AM, Ian Hickson <ian@hixie.ch> wrote:
> On Fri, 11 May 2012, Tab Atkins Jr. wrote:
>> For something like this:
>> $("<p>Example "+exnum+":</p><p><img src="+exsrc+">").appendTo(container);
> Can we really not come up with anything better? It makes me really sad to
> think that the best we can do here is to go from a nice structured
> environment, concatenate our data together into a string, and then reparse
> the string back into structured data to add it to the DOM.
> I understand that people do this kind of thing all the time, but I've
> always at least assumed that everyone agreed that it was a necessarily
> evil because the alternatives were even worse. I had hope when we were
> discussing Element.create() that maybe we were finally coming up with a
> workable alternative, but as far as I can tell that never went anywhere
> and now we're actually talking about adding APIs to _support_ string-based
> DOM tree generation as if it's an actually sane way of writing code.
> Am I really the only one here who thinks this is horrifying?

I'm sure you're not the only one, but you're a rarity.  Most authors
find it really good.

It's very simple to go from having this in your static mockup:

<p>Example 1: <p><img src=image.php?foo=bar>

...to having this in your real site:

$("<p>Example "+exnum+":<p><img src="+exsrc+">").appendTo(container);

It's substantially harder to go to this:

container.appendChild(Element.create("p", ["Example"+exnum]));
container.appendChild(Element.create("p", [Element.create("img", {src:

And it's a lot harder to read, too.

Again, Element.create() is great when you're generating elements out
of lots of dynamic pieces (all the "+foo+" in your string gets
unwieldy and awkward).  It's harder to use when you're generating
elements that are static or mostly so.

Received on Friday, 11 May 2012 00:12:58 UTC

This archive was generated by hypermail 2.4.0 : Friday, 17 January 2020 18:13:34 UTC