1:xml 服务端：服务端怎么发送xml 格式的数据 header("Content-Type:text/xml") 客户端：xhr.responseXML,这样我们得到的是DOM对象，然后我们使用D
1:xml
服务端：服务端怎么发送xml 格式的数据
header("Content-Type:text/xml")
客户端：xhr.responseXML,这样我们得到的是DOM对象，然后我们使用DOM的API去解析数据。
接收数据
2:json
数据格式，一种轻量级的数据格式。
它是以键值对的方式去描述。key:value
表示一条记录 {} 里面可以有多个键值对组成.
还可以使用json表示多条记录
[{},{},{}]
我们key 对应的值的类型可以是任意的类型
{"xqah":[{},{}]}
{"constants":{}}
服务端：
怎么发送json 格式的数据
header("Content-Type:text/json");
客户端：
客户端怎么去解析服务端返回的json 格式数据
var data=xhr.responseText;
//解析json 格式数据，有两种方式，js
//将json 格式的数据转换成JavaScript 的对象。
var obj=eval("("+data+")")
var obj1=JSON.parse(data);
3:省市区联动
4:jQuery 调用ajax 方法
jQuery 对 XMLHttpRequest 也进行了封装。
它给我们提供了ajax方法，让我们直接通过这个方法跟服务端进行交互
$.ajax({
url:"",
data:"",
type:"",
timeout:3000,
success:function(){
},
beforeSend:function(){
},
error:function(){
},
complete:function(){
}
})
---------------------------------------------------------
js 开发：查找元素，操作dom，操作样式，事件处理，执行动画，ajax 开发（跟后台交互的开发）
框架jQuery，简化js 开发。
jQuery 简化我们js 开发，他肯定是针对
查找元素，操作dom，操作样式，事件处理，执行动画，ajax 开发（跟后台交互的开发）
进行一个包装，让我们更简单的就可以来使用jQuery 的api 来完成上面的功能。
jQuery 选择器，操作dom，操作样式，事件处理，动画操作，ajax
jQuery 同样封装了XMLHttpRequest 对象.
jQuery 封装了他之后提供了一些更加简单的方法来帮助我我们更后台进行交互.
$.ajax() //通过这个方法，就可以跟后台进行交互.
什么才会使用封装：
比如我这几行代码可以完成一个功能，并且在这个页面的多个地方都可以使用到。
我就提炼成一个方法，加上这个方法在多个页面都可以被用到，我就提炼成一个js文件。
如果说在对应的页面要使用，我就直接引入这个文件即可.
ajax 在一个页面有没有可能发送多个ajax 请求。 多个页面有没有可能都发送ajax 请求.
当这几行代码可以完成一个功能，并且在页面的多个地方可以使用，我就会封装成一个方法。
当这个方法封装的时候里面需要传递的参数太多，我们就把这些参数使用一个对象给它封装起来。
因为一个页面可能有多个方法，为了这个页面的js 方法的层次结构比较清晰，我们要求对这些方法
面向对象编程。把这些方法那对象包起来。
var obj={ 可能分为下面三个模块放数据，解析，验证
constants:{ 页面很多的常量放这里
provinceData:"", 页面可能有很多省份的数据
}
parse:{ //parse解析
parseXML:function(){ 一个页面可能有解析XML格式的
},
parserJSON:function(){ 一个页面可能有解析JSON格式的
}
},
validate:{ //validate 验证
validateTel:function(){ 页面可能需要验证号码
},
validateEmail:function(){ 页面可能需要验证邮箱
}
}
}
//多个页面都需要使用到ajax 方法，提炼到一个文件当中去 .
1. XML
一种标记语言，类似HTML，用来传输数据，具有自我描述性。 是纯文本
语法规则：
1、必须有一个根元素
2、不可有空格、不可以数字或.开头、大小写敏感
3、不可交叉嵌套
4、属性双引号（浏览器自动修正成双引号了）
5、特殊符号要使用实体
6、注释和HTML一样
2. XML声明 第一行是XML的声明,指定XML版本(1.0)以及使用的编码(UTF-8万国码)
<?xml version="1.0" encoding="UTF-8"?>
自定义标签 XML中没有默认的标签,所有的标签都是我们定义者自定义的
双标签 XML中没有单标签,都是双标签
根节点XML中必须有一个根节点,所有的子节点都放置在根节点下
XML属性 跟HTML一样,XML的标签里面也能够添加属性type = 'text',但是不建议这样用,而是使用标签的方式来表述内容(下半部分代码)
3. XML解析
因为XML就是标签,所以直接用解析Dom元素的方法解析即可
4. PHP中设置Header
在PHP中如果要使用XML传输数据,需要使用header()设置返回的内容为XML
header('content-type:text/xml;charset=utf-8');
5. XML案例 xml格式的数据获取案例
<?php
header("Content-Type:text/xml;charset=utf-8");
echo "<?xml version='1.0' encoding='utf-8'?><xml><user>ccc</user></xml>";
?>
6. JSON
JSON JavaScript Object Notation 另一种轻量级的文本数据交换格式
header('content-type:text/json;charset=utf-8');
7. JSON解析方法 将JSON转换成javascript对象
第一种： eval(); ()里面的必须用()包起来 比如说eval('('+data+')');
第二种： JSON.parse() 一般我们用第二种
8. xhr.onreadystatechange=function(){
if(xhr.readyState==4){
if(xhr.status==200){
// //xhr.responseXML 接收xml
//接收服务端返回的 json 格式的数据
var data=xhr.responseText;
// alert(data);
//{"username":"zhouxing"} 这个是字符串
//js 解析json ，
/* var obj={
"name":"zhouxing",
"age":11,
"xqah":[]
};*/
//获取到zhouxing obj.name 前提是obj 是一个对象.
//我们可以将一个符合json 格式的字符串转换成JavaScript的对象。
//对象.属性 得到值
//怎么去转换，js 提供了两种转换方式.
alert(data);
//eval 的函数来帮助我们转换
//eval 方法要求传进去的json字符串必须是使用()
//({"username":"zhouxing"})
//var obj=eval("("+data+")");
//alert(obj.username);
//提供了一个对象JSON.parse()
var obj=JSON.parse(data);
alert(obj); }
}
}
9. return; 没跟东西就没返回值
return false; 有返回值
10. textfield只有一行可写
textarea是一个区域,可以有很多行，textarea 的方法比textfield的多
10. 三级联动案例
onchange事件（下拉框改变的时候触发）
当元素的值发生改变时，会发生 change 事件。
该事件仅适用于文本域（text field），以及 textarea 和 select 元素。当用于 select 元素时，change 事件会在选择某个选项时发生。当用于 text field 或 text area 时，该事件会在元素失去焦点时发生。
10. select的value是显示的option标签里的字，显示的是嘿嘿，select的value就是嘿嘿。
11. jQuery 调用ajax 方法
jQuery 对 XMLHttpRequest 也进行了封装。
它给我们提供了ajax方法，让我们直接通过这个方法跟服务端进行交互
$.ajax({
url:"",
data:"",
type:"",
timeout:3000,
success:function(){
},
beforeSend:function(){
},
error:function(){
},
complete:function(){
}
})
12. 调用jQ ajax方法
<?php
$age=$_GET["username"];
//休眠4s
sleep(4);
echo '{"username":'.$age.'}';
?>
<input type="button" value="jQ ajax 发请求">
<!-- 页面加载完毕，用jQ发送请求 -->
<script>
$(function(){
//jQ有两种类型的方法
//一种是局部方法 css();
//$("div").css();局部方法
//一种是全局方法
//$.ajax(); 我们称为全局方法
//提交方法，地址，数据，接收数据
//调用这个方法，传递的参数是一个对象
$.ajax({
type:"get",//请求提交的方式的类型
url:"jQ_ajax.php",
//这个是发送数据的第一种格式
//data: "username=haha&age=11",//发送到服务端的数据
//这个是发送数据的第二种格式
data:{
username:'haiya',
age:22
},
//以后我们一般通过ajax发送请求，我会给服务器发送一些数据
//以后可以对这些数据进行验证再发送，类似于验证手机号码
beforeSend:function(){
alert("请求发送之前调用");
//如果在这个方法里面return false;就不发送请求了
return false;
},
//设置请求的超时事件
timeout:3000,
//请求成功之后的回调函数
success:function(data){
alert(data);
},
error:function(){//报错的时候
alert("你错了");//url这个地址写错也会弹出这个
},
complete:function(){
alert("请求完成时候调用")//不管成功或者失败
}
});
})
</script>
还有个没提到的是$('form').serialize() 序列化表单（即格式化key=val&key=val）
还有很多可以查
13. jQ ajax发请求 没升级前
14. jQ ajax发请求 第一次升级
用对象把参数包起来
15. jQ ajax发请求 第二次升级
面向对象去操作，模块化编程。
16. jQ ajax发请求 第三次升级
18. 兼容性
IE5、IE6中使用 ActiveXObject("Microsoft.XMLHTTP")
