上一篇文章讲了用原生的js来解析XML文件,今天用一种简单的方式(jquery)来解析,原生的太繁琐。
还是解析的PictureResources.xml文件,和上一篇博客一样,所以在这里就不贴XML的代码了,直接上jquery解析的代码:
var PictureConfig = {
BaseRoot : "",
WallMapRoot : "",
PictureListRoot : "",
WallMaps : null,
PictureList : null,
getObject : function(){
$(function(){
$.ajax({
url: 'xml/PictureResources.xml',
dataType: 'xml',
success: function(data){
PictureConfig.WallMaps = new Object();
PictureConfig.PictureList = new Object();
BaseRoot = $(data).find('BaseRoot').text();
PictureConfig.BaseRoot = BaseRoot;
WallMapRoot = $(data).find('WallMapRoot').text();
PictureConfig.WallMapRoot = WallMapRoot;
var PictureListRoot = $(data).find('PictureListRoot').text();
PictureConfig.PictureListRoot = PictureListRoot;
//解析WallMaps的子节点
var i = 0;
var arrayWallMaps = new Array();
$(data).find('WallMaps').each(function(){
var node = $(this).attr('node');
PictureConfig.WallMaps.node = node;
$(this).children('WallMap').each(function(){
var id = $(this).children('id').text();
var name = $(this).children('name').text();
var tileName = $(this).children('tileName').text();
var tileFolder = $(this).children('tileFolder').text();
var tileExtension = $(this).children('tileExtension').text();
var thumbImageName = $(this).children('thumbImageName').text();
var beginLevel = $(this).children('beginLevel').text();
var endLevel = $(this).children('endLevel').text();
var totalLevels = $(this).children('totalLevels').text();
//构造一个WallMap对象
var object = new Object();
object.id = id;
object.name = name;
object.tileName = tileName;
object.tileFolder = tileFolder;
object.tileExtension = tileExtension;
object.thumbImageName = thumbImageName;
object.beginLevel = beginLevel;
object.endLevel = endLevel;
object.totalLevels = totalLevels;
arrayWallMaps[i] = object;
i = i+1;
});
PictureConfig.WallMaps.wallMapData = arrayWallMaps;
});
//解析PictureListRoot的子节点
var j = 0;
var arrayPictureList = new Array();
var PictureList = $(data).find('PictureList').each(function(){
var node = $(this).attr('node');
PictureConfig.PictureList.node = node;
$(this).children('PitureInfo').each(function(){
var id = $(this).children('id').text();
var name = $(this).children('name').text();
var dataName = $(this).children('dataName').text();
var thumbImageName = $(this).children('thumbImageName').text();
var coverName = $(this).children('coverName').text();
var object = new Object();
object.id = id;
object.name = name;
object.dataName = dataName;
object.thumbImageName = thumbImageName;
object.coverName = coverName;
var arrayTile = new Array();
var k = 0;
$(this).children('Tiles').children('Tile').each(function(){
var tile_id = $(this).children('id').text();
var tileName = $(this).children('tileName').text();
var tileFolder = $(this).children('tileFolder').text();
var tileExtension = $(this).children('tileExtension').text();
var beginLevel = $(this).children('beginLevel').text();
var endLevel = $(this).children('endLevel').text();
var totalLevels = $(this).children('totalLevels').text();
var tile = new Object();
tile.id = tile_id;
tile.tileName = tileName;
tile.tileFolder = tileFolder;
tile.tileExtension = tileExtension;
tile.beginLevel = beginLevel;
tile.endLevel = endLevel;
tile.totalLevels = totalLevels;
arrayTile[k] = tile;
k++;
});
object.Tiles = arrayTile;
arrayPictureList[j] = object;
j++;
});
PictureConfig.PictureList.pictureListData = arrayPictureList;
});
}
});
console.log('PictureConfig : ' + PictureConfig);
});
}
};
打开浏览器的调试工具看看对象的内容和XMl的内容是对应的。