加载xml文档的函数(原生JavaScript版及 jQuery版)
近几天折腾了个摄影页面，记录平时拍的一些影像碎片，修改Wordpress的Filkr相册插件嫌麻烦，于是所有图片的地址都是以静态形式写进去。觉着很麻烦，特别是添加图片时。怎么办？我想到了强大的xml。何不将所有的图片路径数据集中放在一个xml文档中，然后用JavaScript加载该文档，再把数据一条条插进去，这样就不用每次到页面中写html代码了(JSON可以更简洁的解析,但本文是讲xml的，哈)。
如何用JavaScript加载xml文档？ Google 一下，大把的信息，但MS都是有缺陷的(起码我没找到一个全兼容的)，不兼容，比如w3school版本 .怎么办?自己折腾吧，查了JavaScript权威指南，又看了网上一些写法，然后整理出一个原则上是全兼容的加载xml函数。经过本人测试的有：ie6/7/8，FF(Geckos)，Chrome(Webkit)，Opera，没装Safira，但她和Chrome一样的核,应该没问题。
原生JavaScript版本
function loadXml(fileName){
//@mrthink.net
var xmlDoc = null;
if (window.ActiveXObject) {//写给ie系
xmlDoc = new ActiveXObject("Microsoft.XMLDOM");
xmlDoc.async = false;//这句别漏掉,否则 IE系会报完成该操作所需的数据还不可用
//xmlDoc.loadXML(fileName);//这个是用来加载xml字符串的
xmlDoc.load(fileName);//如果用的是xml 文件。
}
else
if (document.implementation && document.implementation.createDocument) {//webkit,Geckos,Op 内核的
var xmlhttp = new window.XMLHttpRequest();
xmlhttp.open("GET", fileName, false);//类型,文件名,是否缓存
xmlhttp.send(null);
xmlDoc = xmlhttp.responseXML;
}
else {
xmlDoc = null;
}
return xmlDoc;
}
上面的函数使用很简单，比如把获取到的xml文档赋值给var xmlDom=loadXml(‘i.xml’)；然后你就可以像操作普通DOM一样操作xml文档内容了。
至于jQuery版本的我就不多说了，有两种方法，兼容性她都为你考虑了，并且调用特别简单，如果你手头有锋利的jQuery 一书，可以在第326页找到相关信息。下面贴出代码：
基于jQuery版本
//可以指定参数的方法@mrthink.net
$.ajax({
//这个是万能的,不单单可以读xml
url:'i.xml', //xml文档路径
type:'GET', //请求方式
dataType:'xml',//文档类型
timeout:1000,//超时时长
cache:false,//是否缓存
error:function(){alert('Oh,oh,Error!Haha!');},//这个是抛出加载失败的信息,比js的智能吧
success:function(xml){
alert('Yeah! Success!');//在这里执行对 xml文档内容的操作
}
});
//更简洁的方法
$.get('i.xml',function(xml){
alert('Yeah! Success!');//在这里执行对 xml文档内容的操作
});
具体实例请到摄影栏目看，那些图片都是从imgdata.xml中加载过来的。其实，Flickr有完善且强大的API机制,但还没弄太明白。改天尝试直接生成一个JSON文件读相应的图片数据，那样会更方便。
