What would be different if
Document.createElement('a')
<a/>
The rest would still be imperative code.
The second one is declarative and leaves it up to the receiver to handle however they seem fit.
I'm not arguing one is better or worse, or that we would be better off if we we're using the JSX way with native support in the browsers, just explaining how I see the differences between the two.
var elem = <a href="#test">Test</a>;
var elem = document.createElement("a");
elem.href = "#test";
elem.innerText = "Test";
var elem = $("<a href='#test'>Test</a>");For an example of a system where the programming language and document generator share data structures, look at Hiccup (and Reagent). One of their very first examples is putting a loop inside a list. There's no special API for the attributes -- it's just an ordinary map. There's no special API for the children -- it's just an ordinary vector.