On 8/3/2011 8:51 AM, Anne van Kesteren wrote:
On Wed, 03 Aug 2011 17:46:50 +0200, Glenn Maynard <[email protected]> wrote:
What's the difference?
ele.setAttribute(x, val) works on any element. ele[x] = val does not.
They also behave differently for a large number of cases and the
latter often takes values of a type other than DOMString.
Seems to me that aria- and data- prefixes are a special case:
data-* and aria-* should always run through the setAttribute code path.
IE9 does have aria attributes on the element as well, in camel case:
element.ariaSelected===element.getAttribute('aria-selected')
It's "always" going to be the case, that setting 'data-*' or 'aria-*'
will assign a DOM string content attribute.
I'd expect this:
a = Element.create("a", {href: "http://link";, onclick: function(e) { },
custom: "value" }, "link");
to be essentially equivalent to
a = document.createElement("a");
a.appendChild(document.createTextNode("link"));
attrs = {href: "http://link";, onclick: function(e) { }, custom:
"value" };
for(key in attrs) a[key] = attrs[key];
Would you expect to write contenteditable as contenteditable or as
contentEditable? Also, would you expect custom to end up as a content
attribute on that <link> element? Because it will not with this code.
contentEditable, tabIndex, innerHTML seem appropriate.
data-* and aria-* should always run through the setAttribute code path.
The DOM footprint should be light.
Example:
Element.create('a', { webkitShadow: Element.create('p','example shadow
paragraph') }, 'this is a link & button') .
attr({role: 'button', onclick: function() { alert('clicked!') }).
attr({tabIndex: 0, data-status: 'this is an example',
custom-attribute: 'not serialized'}).
attr({title: 'title example!', href: 'link.html'});
outerHTML, more or less:
<a title="title example!" role="button" tabindex="0" data-status="this
is an example" href="link.html">this is a link & button</a>
webkitShadow here:
https://lists.webkit.org/pipermail/webkit-dev/2011-June/017340.html
If an author already has their string sanitized, they would pass through
the innerHTML attribute anyway.
var x = document.createElement; has not been a reliable shortcut.
var x = Element.create(); could be.
-Charles
