欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

jQuery解析返回的xml和json方法詳解

 更新時(shí)間：2017年01月05日 09:57:18   作者：QH_JAVA  
這篇文章主要介紹了jQuery解析返回的xml和json方法,結(jié)合實(shí)例形式分析了jQuery解析xml與json的方法與相關(guān)注意事項(xiàng),需要的朋友可以參考下

本文實(shí)例講述了jQuery解析返回的xml和json方法。分享給大家供大家參考，具體如下：

一、jQuery 解析ajax請(qǐng)求返回的xml格式的數(shù)據(jù)

1、發(fā)送ajax請(qǐng)求

<script type="text/JavaScript">
function jqxml(){
 $.ajax({
  url:"http://localhost:18080/servlet/Servlet1",
   // 請(qǐng)求方式
  type:"post",
  // 服務(wù)器返回的數(shù)據(jù)的格式，常用的有 text/xml/json
  dataType:"xml",
  data:{age:1212},
  success:function(data){
   // 這里獲取的data就是一個(gè)xml對(duì)象，這個(gè)對(duì)象可以按照dom樹格式來解析
   var name=$(data).find("infos").find("info").each(function(){
    alert($(this).find("name").text());
    alert($(this).find("age").text());
   });
  },
  error:function (edata){
   alert(edata);
  }
 });
};
</script>

2、servlet 端返回的值

@Override
protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
  // TODO Auto-generated method stub
  String aaa= request.getParameter("age");
  System.out.print("ajax 數(shù)據(jù)："+aaa);
  // 向客戶端響應(yīng)信息
  response.setCharacterEncoding("GBK");
  response.setContentType("text/xml");
  PrintWriter out= response.getWriter();
  out.print("<?xml version=\"1.0\" encoding=\"GBK\"?>");
  out.println("<infos>");
  out.println("<info>");
  out.println("<name>"+"name1"+"</name>");
  out.println("<age>"+12+"</age>");
  out.println("</info>");
  out.println("<info>");
  out.println("<name>"+"name11"+"</name>");
  out.println("<age>"+112+"</age>");
  out.println("</info>");
  out.println("</infos>");
}

二、jquery 解析返回的json 格式的數(shù)據(jù),這里是返回的json對(duì)象格式，如果返回的是json數(shù)組格式，就是js數(shù)組，所以按照js數(shù)組獲取

1、ajax 請(qǐng)求以及解析過程

<script type="text/javascript">
function jqxml(){
 $.ajax({
  url:"http://localhost:18080/servlet/Servlet3",
   // 請(qǐng)求方式
  type:"post",
  // 服務(wù)器返回的數(shù)據(jù)的格式，常用的有 text/xml/json
  dataType:"json",
  data:{age:1212},
  success:function(data){
  // 通過eval() 函數(shù)將字符串轉(zhuǎn)化為js對(duì)象，如果返回的是json對(duì)象則eval() 函數(shù)不處理，如果返回的是json字符串則進(jìn)行轉(zhuǎn)化
  // 注意這樣寫有時(shí)有問題，因?yàn)橐呀?jīng)在ajax中定義了返回的是json對(duì)象而在使用eval() 來轉(zhuǎn)化就有可能報(bào)錯(cuò)，所以要嗎把json 換成text要嗎把eval去了直接使用data
  var json= eval("("+data+")");
    var age1=json.age;
    var name1=json.name;
   alert(age1+""+name1);
  },
  error:function (edata){
   alert(edata);
  }
 });
};
</script>

2、 servlet 返回的json格式數(shù)據(jù)

protected void doPost(HttpServletRequest request,HttpServletResponse response) throws ServletException, IOException {
  // 向ajax 返回json格式的數(shù)據(jù)
  String aaa = request.getParameter("age");
  System.out.print("ajax 數(shù)據(jù)：" + aaa);
  // 向客戶端響應(yīng)信息
  response.setCharacterEncoding("GBK");
  response.setContentType("text/json");
  PrintWriter out = response.getWriter();
  // 這里使用 json 對(duì)象的格式
  String stu = "{age:12,name:name12}";
  out.print(stu);
  out.flush();
  out.close();
}

注意：在使用ajax請(qǐng)求返回 json 數(shù)據(jù)的時(shí)候遇到了如下的問題：

1、后臺(tái)返回的是json 格式的字符串：

String stu = "{\"age\":\"12\",\"name\":\"whd\"}";

大家看到這些轉(zhuǎn)義字符，會(huì)問 干嘛寫這么麻煩，看看就知道： jquery 1.4以后對(duì)json格式變嚴(yán)格了

也就是說必須要這種格式的

{"鍵":"值","鍵":"值"};

像原來的

{鍵:值，鍵:值}
{'鍵':'值','鍵':'值'}

這種都是錯(cuò)誤的，不合標(biāo)準(zhǔn)，所以jquery返回error

2、這個(gè)問題要注意，我自己 寫這篇文章 時(shí)上面的那些代碼都是沒問題的后來使用發(fā)現(xiàn)有問題了，問題是什么那：

① 、使用ajax請(qǐng)求后臺(tái)返回json格式的字符串，之前在ajax請(qǐng)求的dataType="json" 時(shí) 返回的數(shù)據(jù)使用 eval("("++")") 來轉(zhuǎn)化沒問題，之前也有注釋解釋說：

通過eval() 函數(shù)將字符串轉(zhuǎn)化為js對(duì)象，如果返回的是json對(duì)象則eval() 函數(shù)不處理，如果返回的是json字符串則進(jìn)行轉(zhuǎn)化，但現(xiàn)在的情況是如果dataType="json"則eval() 就報(bào)錯(cuò)。而可以直接使用success:function(data) 中的data 這個(gè)json對(duì)象。
② 、使用ajax請(qǐng)求后臺(tái)返回json格式字符串，而如果dataType='text' 則需要使用eval() 來將 json格式的字符串轉(zhuǎn)化為json 對(duì)象。
③ 、如果使用的是純js 則返回的json字符串需要使用 eval() 來轉(zhuǎn)化為json對(duì)象，而如果是jquery 等框架像 ajax中定義dataType="json" 這樣的話在傳遞的過程中已經(jīng)將json格式的字符串轉(zhuǎn)化為了json 對(duì)象，就沒必要使用eval（） 來轉(zhuǎn)化。

在貼吧中有人也問這樣的問題，其中一個(gè)回答如下：

對(duì)于這個(gè)問題：“后臺(tái)調(diào)用了jsonarray.fromobject (list集合)   是不是這樣就是json對(duì)象了  前臺(tái)就不要 eval 了”

首先說明這樣不是json對(duì)象，返回的是一個(gè)json格式的字符串，如果你前端用的是純js，就要eval一下，但如果有用到j(luò)q框架等，它會(huì)幫你自動(dòng)轉(zhuǎn)成json對(duì)象，就不用eval了。

注：eval方法不是轉(zhuǎn)json對(duì)象的意思，而是將字符串轉(zhuǎn)成可執(zhí)行的js代碼。
如：對(duì)于一個(gè)字符串“alert('hello world')"，eval這個(gè)字符串就能執(zhí)行了。

總結(jié)：

在后臺(tái)返回的是json格式的字符串的前提下

如果前臺(tái)獲取的是 json格式的字符串則需要使用 eval() 或JSON.parse(str) 等方法將字符串轉(zhuǎn)化為json 對(duì)象，其實(shí)也就是js對(duì)象

如果前臺(tái)使用了jq等框架并定義了返回的數(shù)據(jù)類型，如ajax中如果定義dataType='json' 則后臺(tái)數(shù)據(jù)傳過來前臺(tái)會(huì)自動(dòng)轉(zhuǎn)化為json對(duì)象即js對(duì)象  就不用我們使用eval() 等方法進(jìn)行轉(zhuǎn)化。

PS：這里再為大家提供幾款關(guān)于xml與json操作的在線工具供大家參考使用：

在線XML/JSON互相轉(zhuǎn)換工具：
http://tools.jb51.net/code/xmljson

在線格式化XML/在線壓縮XML：
http://tools.jb51.net/code/xmlformat

XML在線壓縮/格式化工具：
http://tools.jb51.net/code/xml_format_compress

在線JSON代碼檢驗(yàn)、檢驗(yàn)、美化、格式化工具：
http://tools.jb51.net/code/json

JSON在線格式化工具：
http://tools.jb51.net/code/jsonformat

在線json壓縮/轉(zhuǎn)義工具：
http://tools.jb51.net/code/json_yasuo_trans

更多關(guān)于jQuery相關(guān)內(nèi)容感興趣的讀者可查看本站專題：《jQuery操作xml技巧總結(jié)》、《jQuery操作json數(shù)據(jù)技巧匯總》、《jquery中Ajax用法總結(jié)》、《jQuery擴(kuò)展技巧總結(jié)》、《jQuery常用插件及用法總結(jié)》、《jQuery常見經(jīng)典特效匯總》及《jquery選擇器用法總結(jié)》

希望本文所述對(duì)大家jQuery程序設(shè)計(jì)有所幫助。

相關(guān)文章

最新評(píng)論