DOMTool: Given HTML generate DOM methods
Written by on November 30th, 2006 in Ajax News.
Stuart Colville has developed a tool for generating DOM methods from an HTML snippet called DOMTool:
The idea is that you drop a snippet of HTML in the input and the tool puts it into the document with innerHTML and then loops through that structure to generate the DOM methods needed to append that piece of HTML into a document from a script. There’s a kind of beautiful irony in using innerHTML to generate DOM methods.
I’ve added a basic compat function to handle the problem with name attributes in IE so this would need to be included in the end-user’s script should they be trying to create any elements with name attributes. This funciton only appears when name attributes are present in the input.
Users should also bear in mind that the ouput will not necessarily be optimal but it should be fairly easy to take the output and use it as a basis for production code.
Example
Say you hand the tool:
You will get back:
var txt1=document.createTextNode(’test1′);
p1.appendChild(txt1);
var p2=document.createElement(’P’);
var txt1=document.createTextNode(’test2′);
p2.appendChild(txt1);
var p3=document.createElement(’P’);
var txt1=document.createTextNode(’test3′);
p3.appendChild(txt1);
If you want to give it a whirl, download the tool here: DOMTool 1.01
Source: Ajaxian
Original Article: http://ajaxian.com/archives/domtool-given-html-generate-dom-methods