Ajax传统操作

JavaScript:

----------array： object

定义： var obj= [1, 2, 3, 4]; // 等价于 var obj= new Array(1, 2, 3, 4);

　　----------Json: object

　　 js里面，有一种特殊的对象，就是Json，可以看做一种特殊的Map（仅方便联想）

var data = {"uid":"uuid","username":"xt","sex":"男"，"password":"123456"};

　　-------------基于对象的使用: data.uuid==========>data["uuid"] 前台去处理Json

----------------------------------------------------------->ajax使用

　传 json 得到json

controller-------------->前台界面（显示数据） ===================》局部刷新界面，而不是整个界面

Ajax操作分为四步走：两种请求方式 post，get

1）获取XMLHttpRequest

fucntion craeteXMLHttpRequest(){

　　　　　　　　　　　try{

　　　　　　　　　　　　　　return new XMLHttpRequest();

　　　　　　　　　　　}catch(e){

　　　　　　　　　　　　try{

　　　　　　　　　　　　　　return new ActiveXObject("Microsoft.XMLHTTP")

　　　　　　　　　　　　}catch(e){

　　　　　　　　　　　　　　try{

　　　　　　　　　　　　　　　　return new ActiveXObject("msxml2.XMLHTTP")

　　　　　　　　　　　　　　}catch(e){

　　　　　　　　　　　　　　　　throw e;

　　　　　　　　　　　　　　}

　　 var xmlHttpRequest = new craeteXMLHttpRequest();

　2)打开窗口（如咱们一般访问浏览器）

　　　　 xmlHttpRequest.open("Get","<c:url value='/xt?action=hello&xt=aaa'/>",true); ------》get

　　　　 xmlHttpRequest.open("POST","<c:url value='/product.do?action=checkByPid'/>",true); ---->post 要设置请求头
　　　　 xmlHttpRequest.setRequestHeader("Content-Type","application/x-www-form-urlencoded");

<c:url value='/xt?action=hello&xt=aaa'/> ------------->也可以是一般文本文件

3）浏览器里面输入数据（send）

　　　　xmlHttpRequest.send(null)------------->get

　xmlHttpRequest.send("username"+username)------------->post

4)浏览器回应

xmlHttpRequest.onreadystatechange = function(){
　　if(xmlHttpRequest.readyState==4 &&xmlHttpRequest.status == 200){
　　　　var text = xmlHttpRequest.responseText; //类型text，一般可以接收str

var data = JSON.parse(text); // eval("(" +data+ ")") 两种解析方式

　　　　var xml = xmlHttpRequest.responseXML; //xml str为xml形式

　　};

后台 bean------------》json给前台

 package cn.transfer.test;

 import java.util.ArrayList;

 import java.util.List;

 import java.util.Map;

 import java.util.TreeMap;

 import net.sf.json.JSONArray;

 import net.sf.json.JSONObject;

 import org.junit.Test;

 public class TestJson {

     /*

      * 当map来用

      */

     @Test

     public void fun1() {

         JSONObject map = new JSONObject();

         map.put("name", "zhangSan");

         map.put("age", 23);

         map.put("sex", "male");

         String s = map.toString();

         System.out.println(s);

         System.out.println("----------------------------");

         Map<String,Object> map2 = new TreeMap<String, Object>();

         map2.put("age", 12);map2.put("name", "LiSi");map2.put("sex", "男");

         System.out.println(map2.toString().replace("=", ":"));//{sex=男, name=LiSi, age=12}

     }

     @Test

     public void beanToJson(){

         Person person = new Person("LiSi", 12, "男");

         //对象转换为json

         JSONObject map = JSONObject.fromObject(person);

         System.out.println(map.toString());

     }

     /**

      * JSONArray

      */

     @Test

     public void fun3() {

         Person p1 = new Person("zhangSan", 23, "male");

         Person p2 = new Person("liSi", 32, "female");

         JSONArray list = new JSONArray();

         list.add(p1);

         list.add(p2);

         System.out.println(list.toString());

     }

     /**

      * 原来就有一个List，我们需要把List转换成JSONArray

      */

     @Test

     public void fun4() {

         Person p1 = new Person("zhangSan", 23, "male");

         Person p2 = new Person("liSi", 32, "female");

         List<Person> list = new ArrayList<Person>();

         list.add(p1);

         list.add(p2);

         System.out.println(JSONArray.fromObject(list).toString());

     }

     @Test   // 数组--------------<>JSON

     public void fun5() {

         Person p1 = new Person("zhangSan", 27773, "male");

         Person p2 = new Person("liSi", 32, "female");

         Person[] p = {p1,p2};

         System.out.println(JSONArray.fromObject(p).toString());

     }

     @Test             // String------------>JSON

     public void fun6() {

         JSONObject map = new JSONObject();

         map.put("name", "zhangSan");

         map.put("age", 23);

         map.put("sex", "male");

         Person obj =  (Person) JSONObject.toBean(map, Person.class);

         System.out.println(obj.toString() );

     }

 }

巴特西

Ajax传统操作

最新文章

热门文章