Wiki source for JavascriptDomhandler


Show raw source

=====""DomHandler""=====
""DomHandler"" is a javascript class for creating structured blocks of html using DOM for the dynamic manipulation of web pages.

**license** : [[http://www.opensource.org/licenses/gpl-license.php GPL2]]
**source** : [[http://klenwell.googlecode.com/svn/trunk/JS/domhandler/ google code]]
**demo** : [[http://klenwell.googlepages.com/demo.domhandler.htm klenwell.googlepages.com]]

====Sample Usage====
**working example**
the code below is the actual code from [[http://klenwell.googlepages.com/demo.domhandler.htm the demo]] listed above
%%(javascript)
<!-- HEAD -->
<script type="text/javascript" src="http://klenwell.googlecode.com/svn/trunk/JS/domhandler/domhandler.ini.js"></script>

<!-- BODY -->
<script type="text/javascript">

// create DomHandler object
var MyHandler = new DomHandler(1);
MyHandler.ini();

var blocks_added = 0;
function add_element()
{
if ( blocks_added < 3 )
{
blocks_added++;
var block_id = "ubody_" + blocks_added;
MyHandler.add_element(MyHandler.core, 'p', block_id);
MyHandler.set_html(block_id, 'extra block #' + blocks_added);
}
else
{
alert('this can only be done ' + blocks_added + ' times!');
}
}
MyHandler.add_element(MyHandler.core, 'h4', 'utitle');
MyHandler.add_element(MyHandler.core, 'div', 'ubody');
MyHandler.add_element(MyHandler.container, 'h6', 'ufooter');
MyHandler.set_html('utitle', 'title block');
MyHandler.set_html('ubody', 'body block');
MyHandler.set_html('ufooter', 'click here to add another block');

// add event handler to footer
function uEvent() { add_element(); }
MyHandler.attach_event('ufooter', 'click', uEvent);
MyHandler.publish('script_block');
</script>
</div>

%%

----
CategoryJavascript
Valid XHTML 1.0 TransitionalValid CSSWikkaWiki