原生javascript解析xml文檔

順便提一下，今天作項目有一點問題，如何讓服務程序接口返回的就是json，而不須要 使用 jQuery.ajax設置 dataType就能獲得json呢？

衆所周知，服務端的 數據以json字符串輸出，文檔類型是 「text/html」，所以返回前臺的默認是字符串，若是返回前臺的指定爲json,

須要設置http響應頭application/json，這樣返回的直接就是json對象了。

注意，必須在輸出流以前設置響應頭

//java jsp servlet中,在struts中有2種輸出json的方式，一種是相似serlvet,另外一種是進行json配置,在springmvc中能夠直接返回json

@Override
protected void doPost(HttpServletRequest req, HttpServletResponse res)
    throws ServletException, IOException
  {
      response.setContentType("application/json;charset=UTF-8"); //
      request.setCharacterEncoding("UTF-8");
      PrintWriter out = request.getWriter();
      out.println("{'name':'zhangsan','age':20,'gender':'M'}");  //json通常不用來手寫，請藉助json工具包實現
      out.close();
   }

<?php
header('application/json;charset=utf-8');
echo "{'name':'zhangsan','age':20,'gender':'M'}";

?>

好了，如今說今天的主角<

原生javascript解析xml文檔

>

var loadXML = function(xmlString){ //構建xmldoc對象
   
     var xmlDoc=null;
      
      if(window.DOMParser)  //IE9+,FF,webkit
      {
            try{
                
                domParser = new  DOMParser();
                xmlDoc = domParser.parseFromString(xmlString, 'text/xml');
            }catch(e){
            }
        }
        else if(!window.DOMParser && window.ActiveXObject)
        {   //window.DOMParser 判斷是不是非ie瀏覽器
            var xmlDomVersions = ['MSXML2.DOMDocument','Microsoft.XMLDOM'];
            for(var i=0;i<xmlDomVersions.length;i++){
                try{
                    xmlDoc = new ActiveXObject(xmlDomVersions[i]);
                    xmlDoc.async = false;
                    xmlDoc.loadXML(xmlString); //loadXML方法載入xml字符串
                    break;
                }catch(e){
                    continue;
                }
            }
        }
        else{
            return null;
        }

        return xmlDoc;
    }

給個數據源

var datasource = '<?xml version="1.0" encoding="utf-8" ?>  
<bookstore>  
　　<book id="No1">  
    　　<title>An Introduction to XML</title>  
    　　<author>Chunbin</author>  
    　　<year>2010</year>  
    　　<price>98.0</price>  　　  
    </book>  
　　<book id="No2">  
    　　<title>The Performance of DataBase</title>  
    　　<author>John</author>  
    　　<year>1996</year>  
    　　<price discount='7' data='8'>56.0</price>  
    </book>  
</bookstore>';

而後來使用，用法很簡單

var xmlDoc = loadXML(datasource);
if(xmlDoc)  //xml的解析和html doc幾乎徹底相同，可使用 xmlDoc.getElementById(),xmlDoc.getElementsByTagName()，xmlDoc.getElementsByClassName
{
   var books= xmlDoc.getElementsByTagName('book');
   var book = xmlDoc.getElementById('No2');
   
   if(books)
   {
        for(var i=0;i<books.length;i++)
        {
            var title = books[i].getEelementsByTagName('title')[0].firstChild.nodeValue; //確實有點長，由於
            var author = books[i].getEelementsByTagName('author')[0].innerHTML;//變短點
            var year = books[i].getEelementsByTagName('year')[0].innerHTML; //或者這樣
            var price = Number(books[i].getEelementsByTagName('price')[0].innerHTML);
            
          //有值了，下一步不是個人事了
        }
        
        //獲取屬性使用 attributes,獲得的是nodevaluemap
       var attrs = book.attributes;
       
       for(var i=0;i<attrs.length;i++)
       {
           var attr = attrs[i];
           var attr_name = attr.name;
           var attr_value =  attr.value;          
       }   
   }
}

-----------------------------------------------------------------

經常使用方法，屬性api

attributes: 
id
length
childElementCount
childNodes
children
className
firstChild
firstElementChild
innerHTML（只讀）
lastChild
lastElementChild
localName
nextSibling
nodeName
nodeType
nodeValue
ownerDocument
parentNode
prefix(新)-->表示前綴，xml容許前綴
namespaceURI(新)-->表示命名空間
previousSibling
tagName

注意：xml是字符串數據，通常來講是隻讀的屬性，即便使用某些手段修改，但也不能作到持久化。由於除了文件上傳外js不容許進行io操做

javascript解析xml就此結束

參考連接：http://my.oschina.net/ososchina/blog/343748

try doing it!