Â« Â»

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 clear to query with any platform. XML is being used by more and more web platforms/utilities such as: JavaScript, PHP, .NET, Java, Flash, etc.

Almost web development tools, web applications have exclusive libraries (functions, objects) to process XML data; besides; many famous platforms: WordPress, Zend, Joomla, etc also built its own libraries for XML; this is stable proof to proven above things jsB@nk said.

However, the field of XML is too big to discuss in this short post, because there was many professional books/e-books research it. Now in this post, jsB@nk like only to show you a simple JavaScript application for generating data in XML. Please go to the live demo of this JavaScript code example for short review.

Try more JavaScript XML parse scripts if you like:

- Random of Testimonial Bubbles with XML and jQuery
- getXML

Label: XML in JavaScript, XML to JavaScript, JavaScript XML file, AJAX XML JavaScript, JavaScript in XML, JavaScript DOM XML, JavaScript XML parse, XML with JavaScript, web development tool, web application

For the best in Cable TV, High Speed Internet & Home Phone Service order Comcast Deals and save money.

Report to us error of this JavaScript

Demo
Enlarge
Reload
New window

Code
JavaScript
HTML
Print

Copy All x2

<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 = '<&#63;xml version="'+this.version+'" encoding="'+this.encoding+'"';
			
			/*
			*	modded by Phong Thai @ JavaScriptBank.com
			*/
			buffer = buffer.replace( '&#63;', '?' );
			
		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>

Copy All x2

<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>