加载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文件读相应的图片数据，那样会更方便。