- From: Charles Pritchard <chuck@jumis.com>
- Date: Sat, 06 Aug 2011 12:11:54 -0700
- To: Dominic Cooney <dominicc@google.com>
- CC: WebApps WG <public-webapps@w3.org>, Jonas Sicking <jonas@sicking.cc>, Maciej Stachowiak <mjs@apple.com>, Garrett Smith <dhtmlkitchen@gmail.com>, "Tab Atkins Jr." <jackalmage@gmail.com>, Anne van Kesteren <annevk@opera.com>, Glenn Maynard <glenn@zewt.org>, Aryeh Gregor <ayg@aryeh.name>
On 8/6/2011 9:05 AM, Dominic Cooney wrote:
> Element.create looks neat. Three thoughts:
...
> Let me briefly reiterate that I think we want *both* Element.create
> and constructors; they have complementary uses.
I agree.
>
> Second, re: setAttribute vs setting properties, there might be types
> other than functions we want to not treat as strings; for example if a
> UA implements CSSOM it might be nice to be able to set a style without
> having to serialize and reparse the CSSStyleDeclaration.
>
> Can we spec whether something in the attributes hash is set via
> setAttribute or via setting a property based on the IDL for that element?
How about .attributes as another reserved word:
Element.create('div', { attributes: { 'class': 'foo'} });
Element.create('div', { attributes: [ 'class','foo','class','bar'] }
).attr({textContent: 'Bar class'});
For reserved words: aria-*, data-* are always a DOMString via
setAttribute and
.attributes is an object or array used to run additional setAttribute calls.
If attributes were to accept a DOMString:
Element.create('div', { attributes: 'i-replaced="InnerHTML"
style="font-size: 2em"' });
...
Relevant to the discussion is Doug's createChild proposal:
http://www.w3.org/Graphics/SVG/WG/wiki/Simple_SVG_API#createChild
Doug adds an index integer as the third argument, something to consider.
Passing "0" as an argument is easier than firstChild().insertBefore()
semantics.
Example:
parentElement.createChildNS( htmlns, 'div', { data-test: 'test' }, 0);
// add to parent at position: 0.
Position could be a helpful abstraction:
Element.create('div').create(span,{textContent: 'second node'}).
position(0).create('span', {textContent: 'first node'});
<div><span>first node</span><span>second node</span>
Element.create('div').create('div').create('span', {textContent: 'span
node in two divs'}).
position(-1,0).create('span', {textContent: 'span node in first
div, first child.'});
<div><span>span node in first div, first child</span>
<div><span>span node in two divs</span></div></div>
Could be handy to use with querySelector.
-Charles
Received on Saturday, 6 August 2011 19:12:33 UTC