jquery教程(三)-jquery中的ajax

一．jquery中的ajax应用:语句简单,兼容性,缓存,.....

Jquery 中的ajax 应用

一．jquery中的ajax应用:语句简单,兼容性,缓存,.....

2.0 回忆一下以前手动开发ajax程序的语句

var xmlHttp=new XMLHttpRequest();

xmlHttp.open(‘get’,’demo01.php’);

xmlHttp.Onreadystatechange=callback; //执行成功的时候  触发的回调函数

xmlHttp.send(null/data);

function callback(){

If(xmlHttp.readyState==4 && xmlHttp.status=200(

{}

}

3.0学习一下jquery中的ajax使用

• jQuery.ajax(options)

实现了底层的ajax，表示的信息是最具体的

Options：json类型，表示ajax对象的所有信息

   async ：指定请求是否是异步   默认： true：异步

   cache ：是否缓存   默认： true：缓存

   complete ：当ajax对象的readyState为4时所触发的回调函数

   contentType ：发送数据的类型 application/x-www-form-urlencoded

   data ：要发送的数据

   dataType ：表示期望得到的数据类型（text，xml，json），默认是text

   success ：当ajax对象的readyState为4和status为200时所触发的回调函数

   type ：请求类型 get、post

   url ：请求的服务器页面地址 

• jQuery.get(url,[data],[callback]) 

实现ajax的get请求

url：表示请求的地址

[data]：表示请求时发送的数据   json类型的数据

[callback] ：回调函数

• jQuery.post(url,[data],[callback])

实现ajax的post请求

url：请求地址

[data]：发送的数据 json类型的数据

[callback]：回调函数

#p#jquery教程-jquery中的ajax#e#

二．关于复杂数据类型的传递

有时，我们需要在服务器端向客户端返回大批量数据，比如：多个人的信息，多个商品信息，这些可以使用以下几个技术来解决：

1.  xml

2.  json

2.1如何处理和接收xml数据

在$.ajax方法中，如果想接收服务器返回的xml格式的数据，必须要先设置dataType参数

• 解析xml
• var person=$(msg).find(“person”);
• person.children(“name”).text()); 
• person.children(“jian”).text());
• person.children(“cheng”).text());

2.2 如何处理和接收json

2.3 页面中放一按钮，点击时将product表内所有数据取得到，并输出到表格中

2.4 补充

$.get和$.post接收服务器的xml或json数据类型该如何指定？

$.ajax({

Type

url

dataType:’xml’

});

$.get(url,[data],[callback],[dataType])

$.post(url,[data],[callback],[dataType]]); 

在$.get和$.post方法里，除了第一个参数之外，其它三个参数都是可选的

data：要传递的数据

如果我不想传递任何值

$.get(‘demo01.php’,function(msg){});  请求时不加任何参数

如果想接收到的是json或xml格式的数据，该如何指定？？？

$.get(‘demo01.php’,data,callback,’json’) 最终期望得json数据

$.get(‘demo01.php’,data,callback,’xml’) 期望得xml数据

#p#jquery教程-jquery中的ajax#e#

三. jquery中的each语句的使用

each语句其实就是一个方法，通常用于解析js数组

each语法：

each(callback);

回调函数的格式：

function callback(i,item){

}

i：索引

item：数组当前元素

1、Each语句是一种循环结构语句，数组中有几个元素，each会遍历多少次

 

  3.1 利用each解析xml

在服务器端返回多个人的信息，这些信息保存到了一个xml格式文档中，该如何解析？

$(msg).find(“person”).each(function(i,item){

$(item).children(“name”).text();

  $(item).children(“age”).text();

});

3.2 关于json数组的解析

3.2.1

$(msg).each(function(i,item){

item.id;

item.name;

item.age;

});

3.2.2

var count=msg.length; //几个

for(var i=0;i

msg[i].id;

msg[i].name;

}