xml demo

testDataXml

 <%@ page language="java" contentType="text/html; charset=UTF-8"

     pageEncoding="UTF-8"%>

 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

 <html>

 <head>

 <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

 <title>test html data</title>

 <script type="text/javascript">

     window.onload=function(){

         var aNodes=document.getElementsByTagName("a");

         for(var i=0;i<aNodes.length;i++)

         {

             aNodes[i].onclick=function()

             {

                 var request=new XMLHttpRequest();

                 //4.准备发送请求的数url,加上时间戳

                 var url=this.href;

                 var method="GET";

                 //5.调用XMLHttpRequest的open方法

                 request.open(method,url);

                 //6.调用XMLHttpRequest的send方法

                 request.send(null);

                 request.onreadystatechange=function(){

                     if(request.readyState==4)

                     {

                         if(request.status==200||request.status==304)

                             {

                             //1.目标格式为XML文件，用request.responseXML获取

                             var result=request.responseXML;

                             //2.结果不能址接使用，必须先创建对应的节点，再把节点加入到#details中

                             /***

                             目标格式为：

                             <h2><a href="mailto:andy@clearleft.com">Jeremy Budd</a></h2>

                             <a href="http://andybudd.com/">http://JeremyBudd.com</a>

                            ***/

                             var name=result.getElementsByTagName("name")[0].firstChild.nodeValue;

                             var website=result.getElementsByTagName("website")[0].firstChild.nodeValue;

                             var email=result.getElementsByTagName("email")[0].firstChild.nodeValue;

                             //document.getElementById("details").innerHTML=request.responseText;

                             var aNode=document.createElement("a");

                             aNode.appendChild(document.createTextNode(name));

                             aNode.href="mailto:"+email;

                             var h2Node=document.createElement("h2");

                             h2Node.appendChild(aNode);

                             var aNode2=document.createElement("a");

                             aNode2.appendChild(document.createTextNode(website));

                             aNode2.href=website;

                             var detailNode=document.getElementById("details");

                             detailNode.innerHTML="";

                             detailNode.appendChild(h2Node);

                             detailNode.appendChild(aNode2);

                             }

                     }

                 }

                 return false;

             }

         }

     }

 </script>

 </head>

 <body>

 <h1>People</h1>

 <ul>

     <li><a href="files/andy.xml">Andy</a></li>

     <li><a href="files/richard.xml">Richard</a></li>

     <li><a href="files/jeremy.xml">Jeremy</a></li>

 </ul>

 <div id="details"></div>

 </body>

 </html>

 <?xml version="1.0" encoding="UTF-8"?>

 <details>

     <name>Richard Bubb</name>

     <website>http://adactio.com/</website>

     <email>richard@sohu.com</email>

 </details>

Richard

Json 示例

 <script type="text/javascript">

 var jsonObject={

         "name":"atgugu",

         "age":34,

         "address":{"city":"Beijing","school":"bjtu"},

         "teaching":function(){

             alert("javaee,python.....");

         }

 };

 alert(jsonObject.name);

 alert(jsonObject.address.city);

 alert(jsonObject.teaching());

 </script>

json示例

Json Demo

 <%@ page language="java" contentType="text/html; charset=UTF-8"

     pageEncoding="UTF-8"%>

 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

 <html>

 <head>

 <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

 <title>test json data</title>

 <script type="text/javascript">

 /*

 var jsonObject={

         "name":"atgugu",

         "age":34,

         "address":{"city":"Beijing","school":"bjtu"},

         "teaching":function(){

             alert("javaee,python.....");

         }

 };

 alert(jsonObject.name);

 alert(jsonObject.address.city);

 alert(jsonObject.teaching());

 */

     window.onload=function(){

         var aNodes=document.getElementsByTagName("a");

         for(var i=0;i<aNodes.length;i++)

         {

             aNodes[i].onclick=function()

             {

                 var request=new XMLHttpRequest();

                 //4.准备发送请求的数url,加上时间戳

                 var url=this.href;

                 var method="GET";

                 //5.调用XMLHttpRequest的open方法

                 request.open(method,url);

                 //6.调用XMLHttpRequest的send方法

                 request.send(null);

                 request.onreadystatechange=function(){

                     if(request.readyState==4)

                     {

                         if(request.status==200||request.status==304)

                             {

                             //1.目标格式为XML文件，用request.responseXML获取

                             var jsonresult=request.responseText;

                             var result=eval("("+ jsonresult + ")");

                             //2.结果不能址接使用，必须先创建对应的节点，再把节点加入到#details中

                             /***

                             目标格式为：

                             <h2><a href="mailto:andy@clearleft.com">Jeremy Budd</a></h2>

                             <a href="http://andybudd.com/">http://JeremyBudd.com</a>

                            ***/

                             var name=result.person.name;

                             var website=result.person.website;

                             var email=result.person.email;

                             //document.getElementById("details").innerHTML=request.responseText;

                             var aNode=document.createElement("a");

                             aNode.appendChild(document.createTextNode(name));

                             aNode.href="mailto:"+email;

                             var h2Node=document.createElement("h2");

                             h2Node.appendChild(aNode);

                             var aNode2=document.createElement("a");

                             aNode2.appendChild(document.createTextNode(website));

                             aNode2.href=website;

                             var detailNode=document.getElementById("details");

                             detailNode.innerHTML="";

                             detailNode.appendChild(h2Node);

                             detailNode.appendChild(aNode2);

                             }

                     }

                 }

                 return false;

             }

         }

     }

 </script>

 </head>

 <body>

 <h1>People</h1>

 <ul>

     <li><a href="files/andy.js">Andy</a></li>

     <li><a href="files/richard.js">Richard</a></li>

     <li><a href="files/jeremy.js">Jeremy</a></li>

 </ul>

 <div id="details"></div>

 </body>

 </html>

testDatajson.jsp

 {

     "person":{

     "name":"Richard Bubb",

     "website":"http://adactio.com/",

     "email":"Richard@sohu.com"

         }

 }

richard.js

Ajax-数据格式-xml,json的更多相关文章

  1. Ajax中XML和JSON格式的优劣比较

    刚做完一个小的使用Ajax的项目.整个小项目使用JavaScript做客户端,使用PHP做服务器端.利用xmlHttpRequest组件作为交互工具,利用XML作为数据传输的格式.做完后基本做一个简单 ...

  2. 一、Ajax 二、JSON数据格式 三、Ajax+Jquery 四、分页的实现

    一.Ajax概述###<1>概述 ###<2>组成 以XMLHttpRequest为核心,发送Ajax请求和接收处理结果 以javascript为语言基础 以XML/JSON作 ...

  3. Ajax返回类型JSON,XML

    Ajax的三种返回类型 **一.TEXT *二.JSON 数据显示页面代码: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transiti ...

  4. Ajax调用返回json，xml数据类型(0517--pm)

    一.返回Json型数据: 1.主页面 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" " ...

  5. 异步请求Ajax（取得json数据）

    异步请求Ajax 没有学习Ajax之前请求数据的时候都是整个页面全部刷新了一次,也就是每次请求都会重新请求所有的资源.但是在很多时候不需要页面全部刷新,仅仅是需要页面的局部数据刷新即可,此时需要发送异 ...

  6. iOS开发笔记3：XML/JSON数据解析

    这篇主要总结在iOS开发中XML/JSON数据解析过程用到的方法.XML数据解析主要使用SAX方式的NSXMLParser以及DOM方式的GDataXML,JSON数据解析主要使用NSJSONSeri ...

  7. string xml json格式区别

    string 是一种最普通的储存一串字符的数据格式 xml 是一种可扩展标记语言,它可以用来标记数据.定义数据类型,是一种允许用户对自己的标记语言进行定义的源语言. 它非常适合万维网传输,提供统一的方 ...

  8. jquery通过ajax方法获取json数据不执行success

    1.jquery通过ajax方法获取json数据不执行success回调 问题描述:jquery通过ajax方法获取json数据不执行success回调方法 问题原因:json格式存在问题或不符合标准 ...

  9. SpringMVC 避免IE执行AJAX时,返回JSON出现下载文件

    <?xml version="1.0" encoding="UTF-8"?> <!-- SpringMVC配置文件 --> <be ...

  10. iOS基础 - XML & JSON

    一.HTML & XML HTML 是用来描述网页的一种语言 HTML 指的是超文本标记语言 (Hyper Text Markup Language) HTML 不是一种编程语言,而是一种标记 ...

随机推荐

  1. C# 常用日期类型转换帮助类

    本文转载:http://www.cnblogs.com/iamlilinfeng/p/3378659.html 最近工作比较忙,与此同时自己也在业余时间开发一个电子商务网站.虽然每天都很累,但感觉过的 ...

  2. Andoird Studio 错误: 非法字符: '\ufeff' 解决方案。

    从网上下载一个安卓UI模板,导入到AndroidStudio的时候提示MainActivity非法字符: '\ufeff' 解决方案,细细一想编译器没报错,但编译出错,应该是隐蔽字符BOM的问题,于是 ...

  3. Redis命令小细节

    1.  set   setnx   setex set  将字符串 value的值关联到key ,假设key已经存在,那么覆盖原来的,假设不存在.那么就创建 setnx  将key的值设置为value ...

  4. Codeforces Round #332 (Div. 2) A. Patrick and Shopping 水题

    A. Patrick and Shopping Time Limit: 20 Sec Memory Limit: 256 MB 题目连接 http://codeforces.com/contest/5 ...

  5. Gym 100637F F. The Pool for Lucky Ones 暴力

    F. The Pool for Lucky Ones Time Limit: 20 Sec Memory Limit: 256 MB 题目连接 http://codeforces.com/gym/10 ...

  6. Communications link failure报错的处理

    一.报错的问题: 测试环境在做压力测试的时候爆出错误 com.mysql.jdbc.exceptions.jdbc4.CommunicationsException: Communications l ...

  7. SAP BW 平面文件创建信息立方体

    T-CODE:RSA1 1.创建信息范围 2.创建信息范围 创建特性信息对象目录 创建关键指标信息对象目录 3.创建特性信息对象 依次创建客户,销售组织 4.创建关键指标 依次创建单价和金额 5.创建 ...

  8. oschina git 私有项目使用。。

    工作流程 安装设置 git 下载最新版本的git http://git-scm.com/downloads 当你安装完成git的时候,你需要简单的配置一下,打开终端: 用户名 第一步,你需要告诉git ...

  9. cocos2d-x3.2在xcode6.1下的 环境搭建

    由于最近需要给CP开发游戏SDK,顺便又重新接触了下cocos2d-x,自己曾在2011年的时候用过cocos2d-x早起的版本,现发现3.2版于原来的差距还是蛮大的,环境搭建流程如下: 1.xcod ...

  10. Linux(Debian) vps安装gnome桌面+VNC

      昨天转载了一篇关于在Linux VPS上安装xface桌面并VNC连接的文章,因为文章是基于CentOS系统来操作的,有热心读者希望有一个Debian下的类似的东西,这就促成了今天的这篇文字.需要 ...