I am creating a DOM constructor that I am working successfully, but now I am trying to assign some abbreviated functions to div()→e("div")
Here is my code:
(function(parent) {
var e = function(tag, options) {
var html = '<'+tag;
var children = Array.prototype.slice.apply(arguments, [(typeof options === "string") ? 1 : 2]);
if(options && typeof options !== "string") {
for(var option in options) {
html += ' '+option+'="'+options[option]+'"';
}
}
html += '>';
for(var child in children) {
html += children[child];
}
html += '</'+tag+'>';
return html;
}
var tags = "div span strong cite em li ul ol table th tr td input form textarea".split(" "), i=0;
for(; i < tags.length; i++) {
(function(el) {
parent[el] = function() {
var args = Array.prototype.slice.call(arguments);
console.log(args);
args[0] = el;
return e.apply(e,args);
};
})(tags[i]);
}
parent.e = e;
})(window);
What is currently happening, the args array changes every time I call one of the shortened functions, and I assume that something should happen, this closure is somewhere, so the args array that I created is not affected every time call. Here is the result of unit tests:
div (div (span ("Content")), span ()) expected: <div><div><span>Content</span></div><span></span></div>result:<div><span></span></div>
div (div (span (e ("b", e ("b", e ("b")))), span ())) Expected: <div><div><span><b><b><b></b></b></b></span><span></span></div></div>result:<div></div>
Louis