klenwell information services : JavascriptDomhandler

DomHandler

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

license : GPL2
source : google code
demo : klenwell.googlepages.com

Sample Usage

working example
the code below is the actual code from the demo listed above
<!-- 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