ajax学习1--使用原生js调用

ajax使用流程：

	1、创建ajax引擎对象
	2、声明监听函数
		//判断ajax状态码
			//判断响应状态码
				//获取响应信息(普通字符串和json格式的字符串)
				//处理响应
	3、创建并发送ajax请求
		创建请求(设置请求方式，设置请求地址，设置异步或者同步)
		发送请求
	4、其他处理

  ## 流程详解：
        ### 1、创建ajax引擎对象
        ### 2、声明事件监听：监听ajax对象的属性readystate的值，一旦readystate的值发生改变就会触发声明的函数的执行
		ajax的状态码之readyState的值:
			0:表示ajax引擎对象创建
			1:表示请求创建但是未发送  ajax.open("get","my");
			2:请求发送 ajax.send(null);
			3:请求处理完毕，正在接收响应内容
			4:响应内容接收完毕(重要状态)
		ajax之响应状态码：ajax.status
			 200:表示一切正常
			 404:资源未找到
			 500:服务器内部错误
		ajax之响应数据		 
			服务器响应给浏览器的数据应该是字符串类型
			但是如果数据量比较大，我们就需要在服务器端将数据拼接成一个良好格式的字符串数据，响应给浏览器。
			浏览器根据格式进行数据的解析和使用。
			问题：
				什么样的格式算是良好的格式呢？
			解决：
				使用json格式的字符串
			json的概念:
				其实json就是js创建对象的一种格式。保证对象中数据的紧密性 和完整性。
			json的格式：
				var 对象名={
					键名:值,
					键名:值,
					...
					键名:值
				}
			使用:
				在服务器端将要响应的数据拼接成json格式的字符串，这样客户端(浏览器端)在接收到响应数据后
				可以使用eval方法将json格式的字符串数据直接转换为对应的js对象，便于数据的操作。
				我们可以在服务器端使用类似Gson的工具包完成json格式字符串的拼接。
    ### 3、创建并发送ajax请求
		创建ajax请求(设置异步或者同步)
			ajax.open(method,url,ansyc);
				method:表示请求方式
					get方式:请求数据以?隔开的形式拼接在url的后面。
							请求数据不能写在send方法中
					post方式:
						post方式需要单独的进行请求数据的设置。使用ajax.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
						设置请求数据为键值对数据。如果有请求数据则ajax.send("键值对数据&键值对数据..."),如果没有请求数据
						则ajax.send(null)
				url:请求地址
				ansyc:设置异步或者同步请求，true表示异步，false，表示同步。默认是异步的。
					 异步：
					 	当前js函数继续执行，无须等待ajax请求的响应以及响应的处理。
					 同步：
					 	当前js函数会等待ajax请求以及响应，当ajax响应处理完毕后，继续执行函数的剩余代码。
		发送ajax请求
			//get方式
				ajax.send(null);
			//post方式
				ajax.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
				ajax.send("uname=张三&pwd=123");

代码:

      //声明单击事件--非ajax
	     	function test(){
	     		window.location.href="my";
	     	}
     	//声明单击事件--ajax
     		function testAjax(){
     			//创建Ajax引擎对象
	     			var ajax;
	     			if(window.XMLHttpRequest){//火狐
	     				ajax=new XMLHttpRequest();
	     			}else if(window.ActiveXObject){//ie
	     				ajax=new ActiveXObject("Msxml2.XMLHTTP");
	     			}
	     		//声明事件监听
	     			ajax.onreadystatechange=function(){
	     				//判断ajax的状态码
	     				if(ajax.readyState==4){
	     					//判断响应状态码
	     					if(ajax.status==200){
	     						//处理响应
			     					//获取响应内容
			     						var data=ajax.responseText;
	     							//使用eval方法将字符串数据转换为js对象
	     								eval("var obj="+data);//eval("var obj={uid:18,uname:'王五',age:18,fav:'看电影'}")
			     					//获取div对象
			     						var div=document.getElementById("showdiv");
			     						div.innerHTML=obj.fav;
	     					}else if(ajax.status==404){
	     						//获取div对象
	     						var div=document.getElementById("showdiv");
	     						div.innerHTML="请求资源不存在";
	     					}else if(ajax.status==500){
	     						//获取div对象
	     						var div=document.getElementById("showdiv");
	     						div.innerHTML="内部服务器繁忙";
	     					}else{
	     						//获取div对象
	     						var div=document.getElementById("showdiv");
	     						div.innerHTML="未知异常";
	     					}
	     				}
	     			}
	     		//发送请求
	     			//get请求方式
		     			/* //创建请求
		     				ajax.open("get","my?uname=张三&pwd=123",false);
		     			//发送请求
		     				ajax.send(null); */
		     		//post请求方式
		     			//创建请求
		     			ajax.open("post","my",false);
		     			//设置请求参数为键值对方式
		     			ajax.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
		     			//发送请求
		     			ajax.send("uname=张三&pwd=123");
	     		//异步同步
	     			var div=document.getElementById("showdiv");
	     			alert(div.innerHTML);
     		}
     	//使用js方式添加监听事件及其监听的函数
     	function testD(){
     		var btn=document.getElementById("btn");
     		btn.onclick=function(){
     			alert("aaaa");
     		}
     	}
     	//js中的josn对象
     		//创建js对象
     		var obj={};
     		//声明对象内容
     		obj.name="张三";
     		obj.pwd="123";
     		//使用json方式创建对象
     		var obj2={
     			name:"李四",
     			pwd:"123"	
     		};
     	var str="{name:'李四',pwd:'123'}";
     		
     		
     		alert(obj.name+":"+obj2.name);