java解析ajax的数据_ajax返回数据解析总结

ajax即异步 JavaScript 和 XML(Asynchronous JavaScript and XML)。

简短地说,在不重载整个网页的情况下,AJAX 通过后台加载数据,并在网页上进行显示。

使用 AJAX 的应用程序案例:谷歌地图、腾讯微博、优酷视频、人人网等等。

通过 jQuery AJAX 方法,您能够使用 HTTP Get 和 HTTP Post 从远程服务器上请求文本、HTML、XML 或 JSON - 同时您能够把这些外部数据直接载入网页的被选元素中。

前面已经提过ajax的方法,这节主要记录针对ajax返回的数据处理方式。

一.html片段

由于服务端返回数据格式为html,因此并不需要特殊处理就可以直接加载到我们的主页面中。

1 $(function(){2 $("#get").click(function(){3 $.get("index.php",{username:$("#user").val(),4 password:$("#password").val()},5 function(data,textStatus){6 $("#get").html(data)7 })8 })9 })

二.xml格式

xml格式的数据需要经过处理,鉴于jquery强大的dom处理能力,处理xml文档也可以使用常规的attr(),find(),filter()以及其他方法。

zhangsan

1

lisi

2

$.ajax({

url:'ajax.asp',

type:'GET',

dataType:'xml',//这里可以不写,但千万别写text或者html!!!

timeout: 1000,

error:function(xml){

alert('Error loading XML document'+xml);

},

success:function(xml){

$(xml).find("student").each(function(i){var id=$(this).children("id"); //取对象

var idvalue=$(this).children("id").text(); //取文本

alert(id_value);//这里就是ID的值了。

alert($(this).attr("email")); //这里能显示student下的email属性。

//最后么输出了,这个是cssrain的写法,貌似比macnie更JQ一点

$('

')

.html(id_value)

.appendTo('ol');

});

}

});

三.json(JavaScript Object Notation)格式

json数据是一种经型的实时数据交互的数据存储方法,JSON 是存储和交换文本信息的语法。类似 XML。JSON 比 XML 更小、更快,更易解析。

{"employees": [

{"firstName":"John" , "lastName":"Doe"},

{"firstName":"Anna" , "lastName":"Smith"},

{"firstName":"Peter" , "lastName":"Jones"}

]

}

var employees = [

{ "firstName":"Bill" , "lastName":"Gates" },

{ "firstName":"George" , "lastName":"Bush" },

{ "firstName":"Thomas" , "lastName": "Carter" }

];

可以这样访问:

1.如果为字符串格式:

如var arr = '{"red":{"id":1,"name":"mary"},"blue":{"id":2,"name":"u71d5u5b50"}}';//u71d5u5b50这个是php中自动转换的

var dataObj = eval("("+arr+")");//只能死记硬背

$.each(dataObj,function(idx,item){

//输出

alert(item.id+"哈哈"+item.name);

})

2.如果为对象格式

var arr = {"red":{"id":1,"name":"mary"},"blue":{"id":2,"name":"u71d5u5b50"}};

$.each(arr,function(idx,item){

//输出

alert(item.id+"哈哈"+item.name);

})

应用实例:

$(document).ready(function(){

$('#button').click(function(){

$.ajax({

type:"GET",

url:"music.txt",

dataType:"json",

success:function(data){

var music="

  • ";

//i表示在data中的索引位置,n表示包含的信息的对象

$.each(data,function(i,n){

//获取对象中属性为optionsValue的值

music+="

"+n["optionValue"]+"";

});

music+="

";

$('#result').append(music);

}

});

return false;

});

});


本文来自互联网用户投稿,文章观点仅代表作者本人,不代表本站立场,不承担相关法律责任。如若转载,请注明出处。 如若内容造成侵权/违法违规/事实不符,请点击【内容举报】进行投诉反馈!

相关文章

立即
投稿

微信公众账号

微信扫一扫加关注

返回
顶部