AJAX/JSON/jQuery

AJAX 主要作用 局部刷新和异步交互

1. 什么是AJAX

    Asynchoronized  javaScript  And Xml	  异步JS和XMl
   

2. AJAX的技术构成

    以JS 为主的操作语言；
    以HTML为显示骨架；以css作为渲染手段；
    以xml 和JSON作为数据传输格式；
    请求和响应的核心对象 是 异步请求对象   类型是XML HttpRequest
   

3. AJAX 对象的创建（使用jQuery创建更方便）

    function  createXHR(){  //创建一个函数用于生成AJAX对象
    	var  xhr = null;// 定义一个变量用于存储XMLHttpRequest类型对象
    	if(this.XMLHttpRequest){// 判断当前浏览器是否支持XMLHTTPRequest
    		xhr = new XMLHttpRequest(); // 支持则创建对象
    	}else{ // 否则 按照微软早期的创建方式创建对象
    			（市面上绝大部分都是支持的）
    		xhr = new ActiveXObject("Microsoft.XMLHTTP");
    	}
    }
   

   JS 的 页面跳转 window.location(“demo2.jsp”)

4. XMLHttpRequest 对应的API

向服务器发送请求：

xhr.open(type,url,async);//规定请求的方式、URL、是否异步处理
	type   字符串类型的参数 代表请求的方式 get post  put   delete
	URl     字符串类型   代表请求的路径
	async  是boolean 类型的参数  默认是true 代表 异步 false 是同步
xhr.send(string); //将请求发送到服务器，string只在post方式使用

获取服务器响应信息：

	var text =  xhr .responseText；	//获取响应的字符串形式的数据
					xhr.responseXML;       //获取xml形式的数据（不推荐）

	//当请求和响应已准备好时，要执行的函数
	xhr. onreadystatechange = 匿名函数 或者 函数名；
	eg:xhr. onreadystatechange = function(){   //常搭配readyState/status 使用
		//等到ajax 交互完毕 并且HTTP状态码是200
		if(xhr .readyState == 4&& xhr.status ==200){ 	
			//使用JS  操作到对应的HTML 元素上
		    document.getElementById("id值").innerHTML=text;  	
		}
	};

注：发送AJAX请求 获取到的是JSON字符串，需转换成JSON对象方可直接取值；JSON对象.key ;//直接取数据

JSON与jQuery

1. 什么是JSON？

   JavaScript  Object Notation   	JS对象表示法；
   是一种轻量级的文本数据交互格式；具有自我描述性；
   并且独立于语言和平台，也易于机器解析和生成；
   

2. 作用与使用场景

    最常见的用法之一，是从Web服务器上读取JSON数据（作为文件或HTTPRequest），
    将JSON数据转换成javaScript 对象，然后在网页中使用该数据 ；	
   

3. 语法、格式

    数据在键值对中，键必须用双引号，键与值之间用冒号分隔；
    每个键值对数据之间用逗号分隔；
    大括号保存对象，中括号保存数组；
   

4. 如何使用对象？常用API

5.  JSON.parse(text [,reviver] );//将数据转换成JavaScript对象
    JSON.stringify(value);// 将JSON对象转换成JSON字符串，value 必须是JSON对象
    JSON数据可以是字符串, 数字, 对象, 数组, 布尔值或 null；
    但是JSON对象中不能存储Date对象，可以用stringify()方法转换
   

6. 如何使用数组？

    遍历数组： for-in 或者for循环
   

7. JSON字符串与java对象的转换

    使用第三方jar包，可以将java类型的对象转换成JSON字符串
    JSONObject.formObject(java对象).toString();
    JSONArray.formObject(java对象的list集合）.toString ();
   

8. .Jquery 对ajax 的支持

   8.1  jquery 对原生ajax 做了哪些改进 
   对异步请求对象的创建  发送参数  以及数据响应的处理 都做了简化，
   同时还考虑了 浏览器兼容   缓存  乱码等问题。
   
   8.2  发送sysTime.do  把返回的系统时间显示到 一个span上。
   
   8.3  jquery 对 ajax 的支持函数
    	 $.ajax(参数)  获取异步请求对象 
      参数 是一个 伪JSON  键位置写不写引号均可 
   {
      url: 字符串类型的  请求的路径,
      type: 字符串类型的  请求的方式  有 get post put delete等
      success: 是一个函数类型的  代表 onreadystatechange  
     			以及 readyState==4 并且 status==200 ；
      			在函数中写参数相当于 responseText。
      cache : 布尔类型的参数    默认是true 如果不需要缓存改成 false 
      data: 伪JSON格式 {key:value,key:value} 统一get post传参 
            并且中文乱码问题  都已经解决
      dataType: 默认返回文本  返回json  写"json" 即可         
      async:是否异步 默认是true 
      error: 当请求出错时 可以在这里有一个提示   这个函数类型的参数   
   }
   
   使用jquery 发送一个ajax请求,把用户的名字 显示到一个span上
   
   8.4 jquery 中的其它ajax 函数 
    $.get(url,data,success,dataType);
    $.post(url,data,success,dataType);
    $.getJSON(url,data,success)
    
       任何jquery 对象 都有一个方法叫 load(url)  可以用来加载页面 或者加载数据
    jquery选择器.load(url);