• 1. 第一章 在.NET 中处理 XML
  • 2. 2SEC6.2 ASP.NET技能结构图SEC6.2ASP.NET技能结构ASP.NET企业级应用核心技术ASP.NET MVC框架与LINQASP.NET企业级应用与Ajax框架扩展课程ASP.NET系统对象ASP.NET控件使用母版页和站点导航统一网站布局数据绑定控件用户控件与自定义控件HttpHandler和缓存技术LINQ系列NUnit单元测试MVC框架技术XML与JSONWeb ServiceAjax 系列之xmlHttp核心对象Ajax系列之AjaxPro框架Ajax系列之JQuery框架ASP.NET操作Excel统计报表Spring.NETNHibernate实现常见的数据操作任务,开发中小型商业站点运用ASP.NET3.0新特性开发企业网站企业开发中最常用的技术构建企业级信息化系统
  • 3. 3本门课程目标学完本门课程后,你能够: 掌握 Ajax 相关技术 提高用户体验 C#操作Excle报表在企业中的应用
  • 4. 4本章任务C#读取XML文件内容 Javascript读取XML文件 C#创建XML文件,Javascript读取XML文件 Javascript与Json交互 C#创建JSON对象,Javascript编译执行后提取JSON对象的值 扩展:Javascript+JQuery实现异步处理程序
  • 5. 5目标C#操作XML文件 Javascript操作XML文件 什么是JSON C#操作JSON串 Javascript操作JSON串
  • 6. 6了解XML结构标识使用的版本 演示根元素的示例代码 ... Phonebook 元素具有开始标签 和结束标签 1998 具有子元素 的 Phonebook 元素XML文档标记遵循开闭原则
  • 7. 7C#读取简单XML文件示例C#读取简单结构XML文件读取简单XML文件示例1 张三 18
    重庆大足
  • 8. 8C#读取简单XML文件示例关键代码//第一步:创建XML文档对象 XmlDocument doc = new XmlDocument(); //第二步:加载XML文档 doc.Load(Server.MapPath("People.xml")); //第三步:获得XML文档的根节点 XmlNode root = doc.DocumentElement; //第四步:读取XML文档中的内容 XmlNodeList nodes = root.ChildNodes; //按照XML文档结构输出 //1-包括节点标记 foreach (XmlNode item in childNodes) { Response.Write(Server.HtmlEncode(item.OuterXml) + "
    "); } //2-不包括节点标记 foreach (XmlNode item in childNodes) { Response.Write(item.InnerText+"
    "); }
  • 9. 9C#读取复杂XML文件示例C#读取简单结构XML文件 张三 18
    重庆大足
    李四 20
    重庆潼南
  • 10. 10C#读取复杂XML文件示例关键代码//创建XML文档对象 XmlDocument doc = new XmlDocument(); //加载XML文件 doc.Load(Server.MapPath("/XML/Peoples.xml")); //获得XML文档根节点 XmlElement root = doc.DocumentElement; XmlNodeList nodes = root.GetElementsByTagName("people"); //按照XML文档结构输出 foreach (XmlNode node in nodes) { foreach (XmlNode item in node) { Response.Write(item.FirstChild.Value + "
    "); } }
  • 11. 11C#创建XML,Js读取文件C#读取简单结构XML文件
  • 12. 12C#创建XML,Js读取文件C#生成XML文件SqlConnection conn = new SqlConnection("server=.;uid=sa;pwd=123456; database=stuDB"); SqlDataAdapter sda = new SqlDataAdapter("select * from stuinfo", conn); DataSet ds = new DataSet("students"); sda.Fill(ds,"stuinfo"); //生成XML文件 ds.WriteXml(Server.MapPath("Student.xml"), XmlWriteMode.WriteSchema); Response.Write("Student.xml文件生成成功");调用生成方法注:如果泛型要生成XML文件,必须手动实现
  • 13. 13C#创建XML,Js读取文件Js读取生成的XML文件(关键代码) //创建XMLDOM对象 var xmlDom = new ActiveXObject("Microsoft.XMLDOM"); //设置是否与数据源(XML文件)同步 xmlDom.async = "false"; //加载XML文件 xmlDom.load("student.xml"); //获得指定节点 var divmsg = document.getElementById("xmlMsg"); var msg ="
      "; msg +="
    • 学号
    • "; var nodes = xmlDom.documentElement.getElementsByTagName("stuinfo"); for(var i=0;i"; } msg +="
    "; divmsg.innerHTML=msg;读取需要的节点
  • 14. 14JSon简介 什么是JSon JSON(JavaScript Object Notation)是一种轻量级的数据交换格式,非常适合于服务器与 JavaScript 的交互。相比XML,他更易于人阅读和编写,它是JavaScript的一个子集。 JSON采用完全独立于语言的文本格式,可以在流行的语言中使用,比如C# Java C++ VB。这些特性使JSON成为理想的数据交换语言
  • 15. 15JSon的构建结构 1、“键/值”对的集合(A collection of name/value pairs) 不同的语言中,它被理解为对象(object),记录(record),结构(struct),字典(dictionary),哈希表(hash table),有键列表(keyed list),或者关联数组(associative array) 2、值的有序列表(An ordered list of values) 在大部分语言中,它被理解为数组(array) 这使得一种数据格式在同样基于这些结构的编程语言之间交互成为可能
  • 16. 16JSon的表现形式 对象是一个无序的“‘键/值’对”集合。 一个对象以“{”(左括号)开始,“}”(右括号)结束。每个“名称”后跟一个“:”(冒号);“‘名称/值’对”之间使用“,”(逗号)分隔。 {"StuName": "Jack ", " Age " : " 20 " , " Email " : " jack@zuxia.com " } 实际上比等效的纯文本名称/值对占用更多的空间,但是数据量大的时候就体现出它的优势{"StuName": "Jack" } 等价 firstName= Jack
  • 17. 17JSon的表现形式 数组是值(value)的有序集合 。 一个数组以“[”(左中括号)开始,“]”(右中括号)结束。值之间使用“,”(逗号)分隔。 { "people": [   {"StuName": "Jack ", " Age " : " 20 " , " Email " : " jack@zuxia.com " }, {"StuName": "Rose ", " Age " : " 20 " , " Email " : " rose@zuxia.com " },   {"StuName": "Lili ", " Age " : " 20 " , " Email " : " lili@zuxia.com " } ] } 相比XML的标记,JSon提高可读性,减少复杂性
  • 18. 18JSon的表现形式 值(value)可以是双引号括起来的字符(string)、数值(number)、true、false、 null、对象(object)或者数组(array)。这些结构可以嵌套
  • 19. 19访问数据-JS访问JSon使用JS定义JSon数据(JSon串)//定义简单JSON串 var people1 = { "name": "张三", "age": 20, "sex": "男" }; //数组方式定义 var peoples = { "people": [ { "name": "张三", "age": 20, "sex": "男" }, { "name": "李四", "age": 22, "sex": "女" }, { "name": "王五", "age": 26, "sex": "女" } ] };定义简单,容易阅读,那么如何读取其中的数据呢? JavaScript访问JSon中的数据示例
  • 20. 20访问数据-JS访问JSon使用JS定义JSon数据(JSon串)//定义简单JSON串 var people1 = { "name": "张三", "age": 20, "sex": "男" }; //数组方式定义 var peoples = { "people": [ { "name": "张三", "age": 20, "sex": "男" }, { "name": "李四", "age": 22, "sex": "女" }, { "name": "王五", "age": 26, "sex": "女" } ] }; //取值 document.getElementById("msgJSON").innerHTML += "输出JSON对象当中的值"; for (var i = 0; i < peoples.people.length; i++) { document.getElementById("msgJSON").innerHTML += "
    姓名:" + peoples.people[i].name + "\t性别:" + peoples.people[i].sex + "\t年龄:" + peoples.people[i].age + "
    ";访问简单
  • 21. 21C#生成JSon,Javascript访问JSon使用C#生成JSon串,Javascript访问JSon串LINQ To SQL与数据库交互
  • 22. 22C#生成JSon,Javascript访问JSon using System.Web.Script.Serialization;//JSON序列化 //C#后台关键代码 //与数据库交互生成JSON public void GetJSON() { //如果本表中有其他表的外键,那么必须停用延迟加载(即不加载其关联表的内容) db.DeferredLoadingEnabled = false; //通过lambda表达式获得数据 var list = db.GetTable().ToList(); //序列化list成JSON串 JavaScriptSerializer js = new JavaScriptSerializer(); this.divMsg.InnerHtml = js.Serialize(list); }有循环引用将泛型集合序列化为JSON串 //Javascript调用方法 function ReadJSON() { var json = document.getElementById("divMsg").innerHTML; //使用eval方法将JSON串编译执行后生成JS能识别的JSON对象 var list = eval(json); //输出JSON内容 var tab = "
      "; tab += "
    • 学号
    • " + "
    • 姓名
    • "; for (var i = 0; i < list.length; i++) { tab += "
    • " + list[i].stuNo + "
    • " + "
    • " + list[i].stuName + "
    • " } document.getElementById("table").innerHTML = tab; }调用JavaScript的Eval方法就可以将JSON字符串序列化成为JavaScript对象
    • 23. 23扩展:JQuery+JSON实现异步处理1、创建JsonHandler.ashx一般处理文件,用于生成JSon串 2、创建Html或者aspx页面,用户添加学生信息 3、添加JQuery需要的JS文件从JsonHandler中读取返回的JSon串,进行绑定添加学员,使用AJAX技术
    • 24. 24C#生成JSon,Javascript访问JSon //绑定下拉列表 function loadClassic() { //清空下拉列表 $("#ddlClassic").empty(); $.getJSON("JSONHandler.ashx", { action: "View" }, function(data) { $.each(data, function(i, item) { $("") .val(item["classId"]) .text(item["className"]) .appendTo($("#ddlClassic")); }); }); } $(function() { loadClassic(); });循环操作,将数据添加到下拉列表中//HttpHander 关键代码 …… context.Response.ContentType = "text/plain"; db.DeferredLoadingEnabled = false; string action = context.Request.Params["action"]; if (action == "View") { //提取班级列表信息 var list = db.GetTable().ToList(); //序列化JSON串 JavaScriptSerializer js = new JavaScriptSerializer(); //响应到客户端 context.Response.Write(js.Serialize(list)); } ……
    • 25. 25C#生成JSon,Javascript访问JSonvar json; function AddStudent() { //定义一个JSON的学生对象 var stu = { "stuNo": "0", "stuName": "", "sex": "", "age": "", "classid":"", "address": "" }; stu.stuName = $("#txtStuName").val(); stu.sex = $("input[name='radSex']:checked").val(); stu.age = $("#txtAge").val(); stu.classid = $("#ddlClassic").val(); stu.address = $("#txtAddress").val(); //序列化JSON串 json = Serialize(stu); $.post("JSONHandler.ashx", { action: "Add", data: json }, function(hello) { alert(hello); }); }序列化JSON串提交数据,并得到返回值
    • 26. 26C#生成JSon,Javascript访问JSonvar json; function AddStudent() { //定义一个JSON的学生对象 var stu = { "stuNo": "0", "stuName": "", "sex": "", "age": "", "classid":"", "address": "" }; stu.stuName = $("#txtStuName").val(); stu.sex = $("input[name='radSex']:checked").val(); stu.age = $("#txtAge").val(); stu.classid = $("#ddlClassic").val(); stu.address = $("#txtAddress").val(); //序列化JSON串 json = Serialize(stu); $.post("JSONHandler.ashx", { action: "Add", data: json }, function(hello) { alert(hello); }); }序列化JSON串提交数据,并得到返回值
    • 27. 27总结C#中提供JavaScript 对象表示法 (JSON) 序列化和反序列化的类是哪个? 对于JSON数据,需要调用JavaScript的哪个方法就可以将JSON字符串序列化成为JavaScript对象 Eval()方法的作用 System.Web.Script.Serialization Eval()将JSON数据解析并执行,可能会带来意想不到的安全性问题 ,尤其是用户提交的JSON数据