jQuery备忘之(一)：jQuery处理.Net后台返回的Xml格式与Json格式的数据的比较分析

最新推荐文章于 2024-09-26 17:23:32 发布

weixin_34353714

最新推荐文章于 2024-09-26 17:23:32 发布

阅读量81

点赞数

文章标签： json javascript 数据库 ViewUI

原文链接：http://www.cnblogs.com/yangtongnet/archive/2010/05/20/1740200.html

版权

最近项目空闲下来，手头也没有什么事情，所以研究了一下jQuery对后台返回数据格式的处理。可能也是因为之前用JS写code的习惯，所以比较倾向于用JS处理XML格式的数据，当然这也就会造成我后台返回的数据的格式全部为XML的格式，处理起来相对繁琐。

当然我也早就发现Jquery与Json格式的数据结合的非常好，但是一直苦于.NET的对数据转换成Json格式的繁琐，所以一直也没有采用Json格式的数据，或者是在数据相对简单的情况下采用Json格式的数据，其他千篇一律XML，但是今天我分析了一下Jquery对两种数据格式的处理之后，完全改变了心态，并力推大家用Jquery + Json处理后台返回数据。

请看如下比较：

【Jquery + Xml】

如下代码是我查询IPInfo表中前10条数据，并以XML格式输出：

代码

public void XmlToAjax()
{
 DataTable dt = SQLHelper.ExecuteDataTable(SQLHelper.conStrings, CommandType.Text, " select top(10) * from IPInfo " );
 DataSet ds = new DataSet();
 ds.Tables.Add(dt);
 // Console
 Response.ContentType = " text/xml " ;
 Response.Charset = " UTF-8 " ;
 Response.Clear();
 Response.Write( " <?xml version=\ " 1.0 \ " encoding=\ " utf - 8 \ " ?>\n " + ds.GetXml());
 Response.End();
}

我在前台接收到数据后进行如下处理：

代码

下面是输出结果：

result.xml 的结果集为：

代码

result.xml
" <? xml version="1.0" ?>
< NewDataSet >
 < Table1 >
 < IPid > 1 </ IPid >
 < IPFrom > 0.0.0.0 </ IPFrom >
 < IPTo > 0.255.255.255 </ IPTo >
 < IPLocation > IANA CZ88.NET </ IPLocation >
 < IPToNumber > 16777215 </ IPToNumber >
 < IPFromNumber > 0 </ IPFromNumber >
 </ Table1 >
 < Table1 >
 < IPid > 2 </ IPid >
 < IPFrom > 1.0.0.0 </ IPFrom >
 < IPTo > 1.255.255.255 </ IPTo >
 < IPLocation > IANA CZ88.NET </ IPLocation >
 < IPToNumber > 33554431 </ IPToNumber >
 < IPFromNumber > 16777216 </ IPFromNumber >
 </ Table1 >
 < Table1 >
 < IPid > 3 </ IPid >
 < IPFrom > 2.0.0.0 </ IPFrom >
 < IPTo > 2.255.255.255 </ IPTo >
 < IPLocation > IANA CZ88.NET </ IPLocation >
 < IPToNumber > 50331647 </ IPToNumber >
 < IPFromNumber > 33554432 </ IPFromNumber >
 </ Table1 >
 < Table1 >
 < IPid > 4 </ IPid >
 < IPFrom > 3.0.0.0 </ IPFrom >
 < IPTo > 3.255.255.255 </ IPTo >
 < IPLocation > 美国新泽西通用电气公司 </ IPLocation >
 < IPToNumber > 67108863 </ IPToNumber >
 < IPFromNumber > 50331648 </ IPFromNumber >
 </ Table1 >
 < Table1 >
 < IPid > 5 </ IPid >
 < IPFrom > 4.0.0.0 </ IPFrom >
 < IPTo > 4.9.255.255 </ IPTo >
 < IPLocation > 美国 CZ88.NET </ IPLocation >
 < IPToNumber > 67764223 </ IPToNumber >
 < IPFromNumber > 67108864 </ IPFromNumber >
 </ Table1 >
 < Table1 >
 < IPid > 6 </ IPid >
 < IPFrom > 4.10.0.0 </ IPFrom >
 < IPTo > 4.10.255.255 </ IPTo >
 < IPLocation > 美国新泽西州立大学 </ IPLocation >
 < IPToNumber > 67829759 </ IPToNumber >
 < IPFromNumber > 67764224 </ IPFromNumber >
 </ Table1 >
 < Table1 >
 < IPid > 7 </ IPid >
 < IPFrom > 4.11.0.0 </ IPFrom >
 < IPTo > 4.11.255.255 </ IPTo >
 < IPLocation > 美国夏威夷 </ IPLocation >
 < IPToNumber > 67895295 </ IPToNumber >
 < IPFromNumber > 67829760 </ IPFromNumber >
 </ Table1 >
 < Table1 >
 < IPid > 8 </ IPid >
 < IPFrom > 4.12.0.0 </ IPFrom >
 < IPTo > 4.19.77.255 </ IPTo >
 < IPLocation > 美国 CZ88.NET </ IPLocation >
 < IPToNumber > 68374015 </ IPToNumber >
 < IPFromNumber > 67895296 </ IPFromNumber >
 </ Table1 >
 < Table1 >
 < IPid > 9 </ IPid >
 < IPFrom > 4.19.78.0 </ IPFrom >
 < IPTo > 4.19.78.255 </ IPTo >
 < IPLocation > 美国西南政法大学 </ IPLocation >
 < IPToNumber > 68374271 </ IPToNumber >
 < IPFromNumber > 68374016 </ IPFromNumber >
 </ Table1 >
 < Table1 >
 < IPid > 10 </ IPid >
 < IPFrom > 4.19.79.0 </ IPFrom >
 < IPTo > 4.19.79.63 </ IPTo >
 < IPLocation > 美国 Armed Forces Radio/Television </ IPLocation >
 < IPToNumber > 68374335 </ IPToNumber >
 < IPFromNumber > 68374272 </ IPFromNumber >
 </ Table1 >
</ NewDataSet >
"

看到这一串代码，那我接下来面对的问题就是去分析这一串代码，取出我所需要的数据，以前一直都是这样处理的（），就像这一段代码：

$(result).find("Table1").each(function() { ID += $(this).children("IPid").text() + " "; }); 是要取出XML中的所有IPid的数据。

（顺便插入一句：因为用Jquery操作XML，所以代码相对比较简洁，如果用JS的话会较之麻烦一些。）

那我们接下来再看看Jquery是如何处理Json格式的数据的：

【Jquery + Json】

在处理之前，首先我们要做一件事，就是将数据库取出的数据转换成Json格式，可能已存在有多种转换方法，这里呢我就先说下自己的Json转换方法：

首先创建一个JsonHelper的类如下：

代码

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.IO;
using System.Web;
using System.Runtime.Serialization.Json;

namespace LinqModel
{
 public static class JsonHelper
 {
 /// <summary>
 /// 格式化成Json字符串
 /// </summary>
 /// <param name="obj"> 需要格式化的对象 </param>
 /// <returns> Json字符串 </returns>
 public static string ToJson( this object obj)
 {
 // 首先，当然是JSON序列化
 DataContractJsonSerializer serializer = new DataContractJsonSerializer(obj.GetType());

 // 定义一个stream用来存发序列化之后的内容
 Stream stream = new MemoryStream();
 serializer.WriteObject(stream, obj);

 // 从头到尾将stream读取成一个字符串形式的数据，并且返回
 stream.Position = 0 ;
 StreamReader streamReader = new StreamReader(stream);
 return streamReader.ReadToEnd();
 }
 }
}

当然这里我们需要引用两个DLL文件（System.Runtime.Serialization.Json，System.ServiceModel.Web），当然这里直接添加添加.net引用，找到这两个DLL就OK了，然后我们需要创建一个实体类，以便用泛型操作，代码如下：

代码

/// <summary>
 /// 实体类IPInfo 。(属性说明自动提取数据库字段的描述信息)
 /// </summary>
 [DataContract]
 public class IPInfo
 {
 public IPInfo()
 { }
 #region Model
 private long _ipid;
 private string _ipfrom;
 private string _ipto;
 private string _iplocation;
 private string _ipcity;
 private string _iptonumber;
 private string _ipfromnumber;
 /// <summary>
 /// Key
 /// </summary>
 [DataMember]
 public long IPid
 {
 set { _ipid = value; }
 get { return _ipid; }
 }
 /// <summary>
 /// 区间开始
 /// </summary>
 [DataMember]
 public string IPFrom
 {
 set { _ipfrom = value; }
 get { return _ipfrom; }
 }
 /// <summary>
 /// 区间结束
 /// </summary>
 [DataMember]
 public string IPTo
 {
 set { _ipto = value; }
 get { return _ipto; }
 }
 /// <summary>
 /// 位置
 /// </summary>
 [DataMember]
 public string IPLocation
 {
 set { _iplocation = value; }
 get { return _iplocation; }
 }
 /// <summary>
 /// 城市
 /// </summary>
 [DataMember]
 public string IPCity
 {
 set { _ipcity = value; }
 get { return _ipcity; }
 }
 /// <summary>
 ///
 /// </summary>
 [DataMember]
 public string IPToNumber
 {
 set { _iptonumber = value; }
 get { return _iptonumber; }
 }
 /// <summary>
 ///
 /// </summary>
 [DataMember]
 public string IPFromNumb er
 {
 set { _ipfromnumber = value; }
 get { return _ipfromnumber; }
 }
 #endregion Model

 }

注意：如果要对该类进行序列化，一定要在类前面添加上“[DataContract]”，在属性前面添加上“[DataMember]”，这样才能被“DataContractJsonSerializer”序列化成JSON。

下面我们来看如何调用这个方法转换成Json格式的数据：

代码

public void JsonToAjax()
 {
 using (SqlDataReader reader = SQLHelper.ExecuteReader(SQLHelper.conStrings, CommandType.Text, " select top(10) * from IPInfo " ))
 {
 List < LinqModel.IPInfo > list = new List < LinqModel.IPInfo > ();
 while (reader.Read())
 {
 LinqModel.IPInfo model = new LinqModel.IPInfo();
 model.IPCity = reader[ " IPCity " ].ToString();
 model.IPFrom = reader[ " IPFrom " ].ToString();
 model.IPFromNumber = reader[ " IPFromNumber " ].ToString();
 model.IPid = long .Parse(reader[ " IPid " ].ToString());
 model.IPLocation = reader[ " IPLocation " ].ToString();
 model.IPTo = reader[ " IPTo " ].ToString();
 model.IPToNumber = reader[ " IPToNumber " ].ToString();
 list.Add(model);
 }
 // list.ToJson();
 Response.Write(list.ToJson());
 Response.End();
 }

 }

就是如此调用：list.ToJson()，简单吧，下面看一下输出的结果：

代码

[{"IPCity":"","IPFrom":"0.0.0.0 ","IPFromNumber":"0","IPLocation":"IANA CZ88.NET","IPTo":"0.255.255.255 ","IPToNumber":"16777215","IPid":1},{"IPCity":"","IPFrom":"1.0.0.0 ","IPFromNumber":"16777216","IPLocation":"IANA CZ88.NET","IPTo":"1.255.255.255 ","IPToNumber":"33554431","IPid":2},{"IPCity":"","IPFrom":"2.0.0.0 ","IPFromNumber":"33554432","IPLocation":"IANA CZ88.NET","IPTo":"2.255.255.255 ","IPToNumber":"50331647","IPid":3},{"IPCity":"","IPFrom":"3.0.0.0 ","IPFromNumber":"50331648","IPLocation":"美国新泽西通用电气公司","IPTo":"3.255.255.255 ","IPToNumber":"67108863","IPid":4},{"IPCity":"","IPFrom":"4.0.0.0 ","IPFromNumber":"67108864","IPLocation":"美国 CZ88.NET","IPTo":"4.9.255.255 ","IPToNumber":"67764223","IPid":5},{"IPCity":"","IPFrom":"4.10.0.0 ","IPFromNumber":"67764224","IPLocation":"美国新泽西州立大学","IPTo":"4.10.255.255 ","IPToNumber":"67829759","IPid":6},{"IPCity":"","IPFrom":"4.11.0.0 ","IPFromNumber":"67829760","IPLocation":"美国夏威夷","IPTo":"4.11.255.255 ","IPToNumber":"67895295","IPid":7},{"IPCity":"","IPFrom":"4.12.0.0 ","IPFromNumber":"67895296","IPLocation":"美国 CZ88.NET","IPTo":"4.19.77.255 ","IPToNumber":"68374015","IPid":8},{"IPCity":"","IPFrom":"4.19.78.0 ","IPFromNumber":"68374016","IPLocation":"美国西南政法大学","IPTo":"4.19.78.255 ","IPToNumber":"68374271","IPid":9},{"IPCity":"","IPFrom":"4.19.79.0 ","IPFromNumber":"68374272","IPLocation":"美国 Armed Forces Radio\/Television","IPTo":"4.19.79.63 ","IPToNumber":"68374335","IPid":10}]

标准的Json格式，呵呵，看了上面的代码，是不是很方便，我想下面的操作就更简单了，看下面的Jquery代码：

代码

我们再来看一下 result的结果集：

result
{...}
    [0]: {...}
    [1]: {...}
    [2]: {...}
    [3]: {...}
    [4]: {...}
    [5]: {...}
    [6]: {...}
    [7]: {...}
    [8]: {...}
    [9]: {...}

result[0]
{...}
    IPCity: ""
    IPFrom: "0.0.0.0        "
    IPFromNumber: "0"
    IPid: 1
    IPLocation: "IANA CZ88.NET"
    IPTo: "0.255.255.255 "
    IPToNumber: "16777215"

就像操作一个泛型一样简单，便捷。

转载于:https://www.cnblogs.com/yangtongnet/archive/2010/05/20/1740200.html