Prototipo de renderizador de html paa javascript.

html_canvas.js

var html_canvas = function (spec) {
	var html = spec.html || "";
	
	var created_object = {};
	
	//public methods
	created_object.render = function(component) {
		component.renderOn(this);
		return this;
	};
	
	created_object.renderContent = function() {
		spec.target.html(html)
	};
	
	created_object.div = function(attributes) {
		return openTag("div", attributes);
	};

	created_object._div = function() {
		return closeTag("div");
	};
	
	created_object.ul = function(attributes) {
		return openTag("ul", attributes);
	};

	created_object._ul = function() {
		return closeTag("ul");
	};
	
	created_object.li = function(attributes) {
		return openTag("li", attributes);
	};

	created_object._li = function() {
		return closeTag("li");
	};
	
	created_object.a = function(attributes) {
		return openTag("a", attributes);
	};

	created_object._a = function() {
		return closeTag("a");
	};
	
	created_object.h1 = function(attributes) {
		return openTag("h1", attributes);
	};

	created_object._h1 = function() {
		return closeTag("h1");
	};
	
	created_object.h2 = function(attributes) {
		return openTag("h2", attributes);
	};

	created_object._h2 = function() {
		return closeTag("h2");
	};
	
	created_object.img = function(attributes) {
		return openTag("img", attributes);
	};

	created_object._img = function() {
		return closeTag("img");
	};
	
	created_object.span = function(attributes) {
		return openTag("span", attributes);
	};

	created_object._span = function() {
		return closeTag("span");
	};
	
	created_object.content = function(content) {
		html += content;
		return created_object;
	};
	
	//private methods
	this.openTag = function(tag, attributes) {
		html += "<"+tag;
		this.mergeAttributesOnTag(attributes);
		html += ">"
		return created_object;
	}
	
	this.mergeAttributesOnTag = function(attributes) {
		for(var attrib in attributes) {    
			if(typeof attrib != 'function') {
				html += " "+attrib+"='"+attributes[attrib]+"'";
			}
		}
	};
	
	this.closeTag = function(tag) {
		html += "</"+tag+">";
		return created_object;
	}
	
	return created_object;	
};