json的定义
json由花括号和键值对组成。
每个键都由引号引起来，键和值之间使用冒号进行分隔。
多组键值对之间使用逗号进行分隔。
var jsonObj={
"key1":12,
"key2":"abc",
"key3":[12,"abc",true],
"key4":[12,"abc",true,{"key1":51}],
"key5":{"key1":42,"key2":"ada"}
}
json的访问
变量名.属性名
alert(jsonObj.key1);
alert(jsonObj.key3[2]);
alert(jsonObj.key5[0].key1);
json的两个常用方法
JSON.stringify()：将json对象转换为json字符串
JSON.parse()：将json字符串转换为json对象
var jsonString=JSON.stringify(jsonObj);
alert(JSON.parse(jsonString));
json在java中的运用
//javaBean和json的互转
public void test1() throws Exception{
Person person=new Person(1,"json");
//需要导入Google提供的java类库GSON
Gson gson=new Gson();
//将javaBean对象转换为json字符串
String personJsonString=gson.toJson(person);
System.out.println(personJsonString);
//将json字符串转换为javaBean对象
Person pJson=gson.fromJson(personJsonString,Person.class);
System.out.println(pJson);
}
//List和json的互转
public void test2() throws Exception{
List<Person> persons=new ArrayList<>();
persons.add(new Person(1,"json"));
persons.add(new Person(2,"json"));
persons.add(new Person(3,"json"));
//创建gson类===谷歌的Gson.jar中提供的工具类
Gson gson=new Gson();
//将任意对象转换为json字符串
Sting listJsonString=gson.toJson(persons);
System.out.println(listJsonString);
//将字符串转换为List集合,PersonListType是继承TypeToken<ArrayList<Person>>的空类
//List<Person> pJosn=gson.fromJson(listJsonString,new PersonListType().getType());
//使用匿名内部类，推荐
List<Person> pJosn=gson.fromJson(listJsonString,new TypeToken<ArrayList<Person>>(){}.getType());
System.out.println(pJosn);
Person person=pJosn.get(0);
System.out.println(person);
}
//map和json的互转
public void test3() throws Exception{
Map<String,Person> person=new HashMap<>();
person.put("p1",new Person(1,"json"));
person.put("p1",new Person(2,"json"));
person.put("p1",new Person(3,"json"));
Gson gson=new Gson();
//将map对象转换为json字符串
String personJsonString=gson.toJson(person);
System.out.println(personJsonString);
//将json字符串转换为map集合
Map<String,Person> pJosn=gson.fromJson(personJsonString,new TypeToken<HashMap<String,Person>>(){}.getType());
System.out.println(pJson.get("p1"));
}
什么是Ajax请求
AJAX即异步JavaScript和XML，是指一种创建交互式网页应用的网页开发技术。一种浏览器异步发起请求，局部更新页面的技术。
//原生ajax请求
<html>
<head>
<script type="text/javascript">
function ajaxRequest(){
//1.我们首先要创建XMLHttpRequest
var xmlHttpRequest=new XMLHttpRequest();
//2.调用open方法设置请求参数
xmlHttpRequest.open(method,url,async);
//4.在send方法前绑定onreadystatechange事件，处理请求完成后的操作
xmlHttpRequest.onreadystatechange=function(){
if(xmlHttpRequest.readyState==4 && xmlHttpRequest.status==200){
//alert(xmlHttpRequest.responseText);
var data=JSON.parse(xmlHttpRequest.responseText);
document.getElementById("div01").innerHTML=data.id+data.name;
}
}
//3.调用send方法发送请求,post可带参数
xmlHttpRequest.send();
}
</script>
</head>
<body>
<button onclick="ajaxRequest()">ajax request</button>
<div id="div01"></div>
</body>
</html>
Jquery中的Ajax请求
$.ajax方法
url 请求的资源地址
type 请求的类型 get/post
data 发送给服务器的数据。name=value&name=value
success 成功的回调函数
datatype 回传数据类型 text、xml、json...
例如：
$.ajax({
url:"ajaxServlet",
type:"GET",
//调用ajaxServlet中的jqueryAjax方法
data:"action=jqueryAjax",
success:function(data){
//alert(data);
var jsonObj=JSON.parse(data);
$("#msg").html("编号："+jsonObj.id+"姓名："+jsonObj.name)
},
dataType:"json"
});
$.get方法和$.post方法
url 请求的资源地址
data 发送给服务器的数据。name=value&name=value
callback 成功的回调函数
type 回传数据类型 text、xml、json...
例如：
$.get("ajaxServlet",{action:"jqueryAjax"},function(data){
$("#msg").html("编号："+data.id+"姓名："+data.name)
},"json");
$.post("ajaxServlet",{action:"jqueryAjax"},function(data){
$("#msg").html("编号："+data.id+"姓名："+data.name)
},"json");
$.getJSON方法
url 请求的资源地址
data 发送给服务器的数据。name=value&name=value
callback 成功的回调函数
例如：
$.getJSON("ajaxServlet",{action:"jqueryAjax"},function(data){
$("#msg").html("编号："+data.id+"姓名："+data.name)
});
表单序列化serialize()：可以吧一个表单内所有表单项以name=value&name=value的形式进行拼接。
$.getJSON("ajaxServlet","action=jqueryAjax&"+$("form").serialize(),function(data){
$("#msg").html("编号："+data.id+"姓名："+data.name)
});
$.ajax({
url:"LoginServlet", //要请求的url地址
type:'post', //请求方法 GET or POST
async:true, //是否使用异步请求的方式
timeout:5000, //请求超时的时间，以毫秒计
data:$(".form").serialize(),//参数，用POST方法时使用，如果用GET方法则直接在url后拼接参数即可
dataType:'text', //预期的服务器返回参数类型
beforeSend:function(){
},//再发送请求前调用的方法
success:function(data) {
if(data!=""){
$(".text-warning").html(data);
}else{
window.location.href="ArticleServlet";
}
}, //请求成功时回调方法，data为服务器返回的数据
error:function(){
}, //请求发生错误时调用方法
complete:function(){
} //回调方法 无论success或者error都会执行
});