XML - a type of data defining - becoming more popular at present because of its flexibility and convenience, data defined by XML become more visual and...
detail at
JavaScriptBank.com - 2.000+ free JavaScript codes
How to setup
Step 1: Use JavaScript code below to setup the script
JavaScript
Code:
<script type="text/javascript">
// Created by: Ariel Flesler | http://flesler.blogspot.com/2008/03/xmlwriter-for-javascript.html
// Licensed under: BSD License
// This script downloaded from www.JavaScriptBank.com
/**
* XMLWriter - XML generator for Javascript, based on .NET's XMLTextWriter.
* Copyright (c) 2008 Ariel Flesler - aflesler(at)gmail(dot)com | http://flesler.blogspot.com
* Licensed under BSD (http://www.opensource.org/licenses/bsd-license.php)
* Date: 3/12/2008
* @version 1.0.0
* @author Ariel Flesler
* http://flesler.blogspot.com/2008/03/xmlwriter-for-javascript.html
*/
function XMLWriter( encoding, version ){
if( encoding )
this.encoding = encoding;
if( version )
this.version = version;
};
(function(){
XMLWriter.prototype = {
encoding:'ISO-8859-1',// what is the encoding
version:'1.0', //what xml version to use
formatting: 'indented', //how to format the output (indented/none) ?
indentChar:'\t', //char to use for indent
indentation: 1, //how many indentChar to add per level
newLine: '\n', //character to separate nodes when formatting
//start a new document, cleanup if we are reusing
writeStartDocument:function( standalone ){
this.close();//cleanup
this.stack = [ ];
this.standalone = standalone;
},
//get back to the root
writeEndDocument:function(){
this.active = this.root;
this.stack = [ ];
},
//set the text of the doctype
writeDocType:function( dt ){
this.doctype = dt;
},
//start a new node with this name, and an optional namespace
writeStartElement:function( name, ns ){
if( ns )//namespace
name = ns + ':' + name;
var node = { n:name, a:{ }, c: [ ] };//(n)ame, (a)ttributes, (c)hildren
if( this.active ){
this.active.c.push(node);
this.stack.push(this.active);
}else
this.root = node;
this.active = node;
},
//go up one node, if we are in the root, ignore it
writeEndElement:function(){
this.active = this.stack.pop() || this.root;
},
//add an attribute to the active node
writeAttributeString:function( name, value ){
if( this.active )
this.active.a[name] = value;
},
//add a text node to the active node
writeString:function( text ){
if( this.active )
this.active.c.push(text);
},
//shortcut, open an element, write the text and close
writeElementString:function( name, text, ns ){
this.writeStartElement( name, ns );
this.writeString( text );
this.writeEndElement();
},
//add a text node wrapped with CDATA
writeCDATA:function( text ){
this.writeString( '<![CDATA[' + text + ']]>' );
},
//add a text node wrapped in a comment
writeComment:function( text ){
this.writeString('<!-- ' + text + ' -->');
},
//generate the xml string, you can skip closing the last nodes
flush:function(){
if( this.stack && this.stack[0] )//ensure it's closed
this.writeEndDocument();
var
chr = '', indent = '', num = this.indentation,
formatting = this.formatting.toLowerCase() == 'indented',
buffer = '<?xml version="'+this.version+'" encoding="'+this.encoding+'"';
/*
* modded by Phong Thai @ JavaScriptBank.com
*/
buffer = buffer.replace( '?', '?' );
if( this.standalone !== undefined )
buffer += ' standalone="'+!!this.standalone+'"';
buffer += ' ?>';
buffer = [buffer];
if( this.doctype && this.root )
buffer.push('<!DOCTYPE '+ this.root.n + ' ' + this.doctype+'>');
if( formatting ){
while( num-- )
chr += this.indentChar;
}
if( this.root )//skip if no element was added
format( this.root, indent, chr, buffer );
return buffer.join( formatting ? this.newLine : '' );
},
//cleanup, don't use again without calling startDocument
close:function(){
if( this.root )
clean( this.root );
this.active = this.root = this.stack = null;
},
getDocument: window.ActiveXObject
? function(){ //MSIE
var doc = new ActiveXObject('Microsoft.XMLDOM');
doc.async = false;
doc.loadXML(this.flush());
return doc;
}
: function(){// Mozilla, Firefox, Opera, etc.
return (new DOMParser()).parseFromString(this.flush(),'text/xml');
}
};
//utility, you don't need it
function clean( node ){
var l = node.c.length;
while( l-- ){
if( typeof node.c[l] == 'object' )
clean( node.c[l] );
}
node.n = node.a = node.c = null;
};
//utility, you don't need it
function format( node, indent, chr, buffer ){
var
xml = indent + '<' + node.n,
nc = node.c.length,
attr, child, i = 0;
for( attr in node.a )
xml += ' ' + attr + '="' + node.a[attr] + '"';
xml += nc ? '>' : ' />';
buffer.push( xml );
if( nc ){
do{
child = node.c[i++];
if( typeof child == 'string' ){
if( nc == 1 )//single text node
return buffer.push( buffer.pop() + child + '</'+node.n+'>' );
else //regular text node
buffer.push( indent+chr+child );
}else if( typeof child == 'object' ) //element node
format(child, indent+chr, chr, buffer);
}while( i < nc );
buffer.push( indent + '</'+node.n+'>' );
}
};
})();
</script>
Step 2: Place HTML below in your BODY section
HTML
Code:
<script type="text/javascript">
var xw = new XMLWriter('UTF-8');
xw.formatting = 'indented';//add indentation and newlines
xw.indentChar = ' ';//indent with spaces
xw.indentation = 2;//add 2 spaces per level
xw.writeStartDocument( );
xw.writeDocType('"items.dtd"');
xw.writeStartElement( 'items' );
xw.writeComment('button');
xw.writeStartElement('item');
xw.writeAttributeString( 'id', 'item-1');
xw.writeAttributeString( 'enabled', 'true' );
xw.writeStartElement( 'code');
xw.writeCDATA( '<button>Save</button>' );
xw.writeEndElement();
xw.writeElementString('description', 'a save button');
xw.writeEndElement();
xw.writeComment('image');
xw.writeStartElement('item');
xw.writeAttributeString( 'id', 'item-2');
xw.writeAttributeString( 'enabled', 'false' );
xw.writeStartElement( 'code');
xw.writeCDATA( '<img src="photo.gif" alt="me" />' );
xw.writeEndElement();
xw.writeElementString('description', 'a pic of myself!');
xw.writeEndElement();
xw.writeComment('link');
xw.writeStartElement('item');
xw.writeAttributeString( 'id', 'item-3');
xw.writeAttributeString( 'enabled', 'true' );
xw.writeStartElement( 'code');
xw.writeCDATA( '<a href="http://google.com">Google</a>' );
xw.writeEndElement();
xw.writeElementString('description', 'a link to Google');
xw.writeEndElement();
xw.writeEndElement();
xw.writeEndDocument();
var xml = xw.flush(); //generate the xml string
xw.close();//clean the writer
xw = undefined;//don't let visitors use it, it's closed
//set the xml
document.getElementById('parsed-xml').value = xml;
</script>
