Tree Style XML Viewer & Formatter - jQuery simpleXML

File Size: 6.07 KB
Views Total: 12972
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
Tree Style XML Viewer & Formatter - jQuery simpleXML

The simpleXML jQuery plugin dynamically formats and renders your XML data in a collapsible tree view format for better readability.

Your users are able to collapse and expand nodes by clicking/tapping the arrows. Syntax highlighting is supported as well.

How to use it:

1. Insert the jQuery simpleXML plugin's JavaScript and CSS files into the page.

<script src="" 
<script src="js/simpleXML.js"></script>
<link rel="stylesheet" href="css/simpleXML.css">

2. Create a container element to place the formatted XML data.

<div id="simpleUseCase"></div>

3. Call the function on the container element and specify the XML object to format.

var xml = "<description><of>Hello</of><og /><blob> </blob><!--  Comment here --><![CDATA[sdfsdf]]><childNode><bob>fd<bob2></bob2><bob21 /></bob></childNode><!--Second Comment--></description>";
  xmlString: xml 

4. Specify the character to be shown when the node is collapsed. Defaults to '...'

  xmlString: xml,
  collapsedText: "..."



  • Addition of support for attributes

This awesome jQuery plugin is developed by borsuksoftware. For more Advanced Usages, please check the demo page or visit the official website.