Friday, June 3, 2011

Read xml node and their attribute with javascript

























Javascript code to read XML file
I have just developed the code to read XML file node and their attributes with javascriptIt is quite easy to do so, here is the code to work with
XML file

<tempXml> <background> <backgroundImage isImage="true" url="1.jpg" height="600"

width="600" ind="0" xx="0" yy="0"/>

</background> <clipArts> <clipArt url="b.jpg" id="IDMon Mar 28 11:37:01 2011 UTC" ind="1" xx="300" yy="300"

imgType="clipArt"

height="150" width="150" itemType="imageType"/>

<clipArt url="a.jpg" id="IDMon Mar 28 11:37:01 2011 UTC" ind="2" xx="150" yy="250"

imgType="clipArt" itemType="imageType"

height="150" width="150"/>

<clipArt url="1290173945_4ce67df9514b6.jpg" ind="3"

id="IDMon Mar 28 11:37:01 2011 UTC" xx="100" yy="100" imgType="clipArt"

itemType="imageType" height="200" width="200"/>

</clipArts>

<images>

<image url="111.png" id="IDTue Mar 29 05:14:46 2011 UTC" ind="4" xx="150" yy="150"

imgType="image"

itemType="imageType" height="500" width="500"/>

<image url="112.png" id="IDTue Mar 29 05:14:46 2011 UTC" ind="5" xx="200" yy="200"

imgType="image"

itemType="imageType" height="400" width="400"/>

<image url="113.png" id="IDTue Mar 29 05:14:46 2011 UTC" ind="6"

xx="250" yy="250" imgType="image" itemType="imageType"

height="300" width="300"/>

</images>

<texts>

<text url="undefined" id="txt1" itemType="textType" text="TEST"

ind="8" font="Verdana" size="72" bold="false" italic="false"

underLine="false" textAllignment="0" color="255" backgroundColor="16777215" borderColor="16777215"

TextColor="undefined" xx="500" yy="200" alpha="undefined"

width="50" height="30" name="undefined"/>

<text url="undefined" id="txt1" itemType="textType" text="TEST!@" ind="7" font="Verdana"

size="72" bold="false" italic="false" underLine="false" textAllignment="0" color="255" backgroundColor="16777215"

borderColor="16777215" TextColor="undefined" xx="50" yy="50"

alpha="undefined" width="50" height="30" name="undefined"/>

</texts>

</tempXml>

Now to read this XML file you just need to use javascript code as below,







function getImageArray()
{
var f = new File('~/Desktop/test3.xml');
f.open('r');
var xml = new XML( f.read() );var imageArray=new Array();var background=xml.child('background') ;var imageNames=new Array();
imageArray[0]=background.backgroundImage.@url+"-"+background.backgroundImage.@xx
+"-"+background.backgroundImage.@yy
+"-"+background.backgroundImage.@height+"-"+background.backgroundImage.@width;
// CODE TO READ `IMAGES` TAG AND THEIR SUBNODE ATTRIBUTES STARTS //
var images=xml.child('images');var tempCount=images.elements().length();
var tempCnt=0;
for(var j=0;j {imageArray[images.image[j].@ind]=images.image[j].@url+"-"+images.image[j].@xx+"-"
+images.image[j].@yy
+"-"+images.image[j].@height+"-"+images.image[j].@width;

// new added code for the height and width ends //

// recently comment to merge everything in one element ends //
tempCnt=tempCnt+1;

}

// CODE TO READ `IMAGES` TAG AND THEIR SUBNODE ATTRIBUTES ENDS //
// CODE TO READ `CLIPART` TAG AND THEIR SUBNODE ATTRIBUTES STARTS //
var clipArts=xml.child('clipArts');
var tempCount=clipArts.elements().length();
for(var j=0;j {

imageArray[clipArts.clipArt[j].@ind]=clipArts.clipArt[j].@url+"-"+clipArts.clipArt[j].@xx+"-"
+clipArts.clipArt[j].@yy+"-"+clipArts.clipArt[j].@height+"-"+clipArts.clipArt[j].@width;
imageNames[tempCnt]=clipArts.clipArt[j].@url;

// recently comment to merge everything in one element ends //

}
// CODE TO READ `CLIPART` TAG AND THEIR SUBNODE ATTRIBUTES ENDS //
// CODE TO READ `TEXT` TAG AND THEIR SUBNODE ATTRIBUTES STARTS //

var texts=xml.child('texts');
var tempCount=texts.elements().length();
for(var j=0;j {

imageArray[texts.text[j].@ind]=texts.text[j].@url+"-"+texts.text[j].@xx+"-"+texts.text[j].@yy
+"-"+texts.text[j].@height+"-"+texts.text[j].@width+"-"+texts.text[j].@text+"-"+texts.text[j].@font
+"-"+texts.text[j].@size+"-"+texts.text[j].@bold+"-"+texts.text[j].@italic+"-"
+texts.text[j].@underLine+"-"+texts.text[j].@textAllignment+"-"+texts.text[j].@color+"-"
+texts.text[j].@backgroundColor+"-"+texts.text[j].@borderColor+"-"+texts.text[j].@TextColor;
imageNames[tempCnt]=texts.text[j].@url;

// recently comment to merge everything in one element ends //

}

// CODE TO READ `TEXT` TAG AND THEIR SUBNODE ATTRIBUTES ENDS //
return imageArray;
f.close();
}
getImageArray();

Enjoy

No comments:

Post a Comment