I quite like the original idea (assigning attributes in the
document.createElement() call), but mixing attributes with properties is, I believe, a bad idea. The semantics are different. Attributes behave in a quite simple, predictable way; properties can have all sorts of behind-the-scenes behaviour attached. For instance, this is perfectly fine:
var span = document.createElement('span'); // --> <span></span>
span.setAttribute('tabindex', 'banana'); // --> <span tabindex="banana"></span>
All we did was create an element with an attribute with a value. No behaviour implied. This is "valid" DOM (valid in the sense that the elements and attributes are actually created and inserted in the DOM). But this…
span.tabIndex = 'banana'; // --> span.tabIndex is now 0
Not at all equivalent.
document.createElement is concerned (and should continue to be, IMO, for clarity) with just the elements/attributes side of the DOM. Properties are, if appropriate, derived from the attributes, just like they are in normal HTML (so
<span tabindex="2"> translates to
span.tabIndex == 2).
@jonathantneal's sample code is close to how I'd see this working… I would just remove the "prefix capitals with letters" behaviour — what's the point of that?