json對象的定義和基本的訪問：
<script type="text/javascript">
window.onload = function(){
/*
var person = {"name":"zhangsan","age":24};
alert(person.name);
alert(person.age);
var person = {"name":"zhangsan","age":24,"phone":{"guhua":123,"shouji":234}};
alert(person.phone.guhua);
alert(person.phone.shouji);
var person = {"name":"張三","age":20,
"phone":{"guhua":123,"shouji":1234},
"address":[{"home":"shanghai1","code":11},{"compony":"泉城廣場1","code":22}]}
alert(person.address[0].home);
alert(person.address[1].compony);
*/
var persons = [
{
"name":"張三","age":20,
"phone":{"guhua":123,"shouji":1234},
"address":[{"jiating":"玉函路1"},{"gongsi":"泉城廣場1"}]
},
{"name":"李四","age":22,
"phone":{"guhua":423,"shouji":4234},
"address":[{"jiating":"玉函路2"},{"gongsi":"泉城廣場2"}]
}
];
/*注意：不要把冒號寫成中文的*/
alert(persons[0].phone.guhua);
alert(persons[1].address[0].jiating);
}
</script>利用ajax與服務器交互，返回json：
<script type="text/javascript" src="json.js"></script> <body>
<input type="button" id="button" value="確定">
<div id="div1"></div>
<div id="div2"></div>
<div id="div3"></div>
<div id="div4"></div>
</body>function ajaxFunction(){
/*
* 創建XMLHttpRequest對象
*/
var xmlhttp;
try{//ff,opear8.0+,safari
xmlhttp = new XMLHttpRequest();
}catch(e){
try{//ie
xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
}catch(e){
try{
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}catch(e){
}
}
}
return xmlhttp;
}
window.onload = function(){
document.getElementById("button").onclick = function(){
//1、創建XMLHttpRequest對象
var xmlReq = ajaxFunction();
//2、接收服務器端的響應
xmlReq.onreadystatechange = function(){
if(xmlReq.readyState==4&&xmlReq.status==200){
//responseText接收返回的json數據
var data = xmlReq.responseText;
//將字符串轉化爲javascript識別的對象
var persons = eval("("+data+")");
//json對象屬性的訪問
document.getElementById("div1").innerHTML=persons[0].name;
document.getElementById("div2").innerHTML=persons[1].name;
document.getElementById("div3").innerHTML=persons[2].name;
document.getElementById("div4").innerHTML=persons[3].name;
}
}
//3、打開和服務器的連接
xmlReq.open("post","/json/personServlet",true);
//post提交時需要加上下面的代碼
xmlReq.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
//4、發送數據
xmlReq.send(null);
}
}
package servlet;
import java.io.IOException;
import java.io.PrintWriter;
import java.util.ArrayList;
import java.util.List;
import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import net.sf.json.JSONArray;
import net.sf.json.JsonConfig;
import entity.Person;
public class PersonServlet extends HttpServlet {
public void doPost(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
response.setContentType("text/html;charset=utf-8");
PrintWriter out = response.getWriter();
Person p1 = new Person("小強",20,"nan",123456);
Person p2 = new Person("旺財",34,"nv",156443);
Person p3 = new Person("奔波了霸",40,"nv",165566);
Person p4 = new Person("霸波了奔",25,"nan",197745);
List list = new ArrayList();
list.add(p1);
list.add(p2);
list.add(p3);
list.add(p4);
//假設list是通過數據庫查詢得到的
/*******************************************************************************************/
//將list中的姓名和年齡以json的格式返回客戶端瀏覽器
/*
* 導入json相關的jar包
*/
JsonConfig config = new JsonConfig();
config.setExcludes(new String[]{"sex","phone","age"});
JSONArray jsonArray = JSONArray.fromObject(list,config);
String json = jsonArray.toString();
out.print(json);
System.out.println(json);
out.close();
}
}
package entity;
public class Person {
private String name;
private Integer age;
private String sex;
private Integer phone;
public Person(String name, Integer age, String sex, Integer phone) {
this.name = name;
this.age = age;
this.sex = sex;
this.phone = phone;
}
public Person() {
}
public String getName() {
return name;
}
public void setName(String name) {
this.name = name;
}
public Integer getAge() {
return age;
}
public void setAge(Integer age) {
this.age = age;
}
public String getSex() {
return sex;
}
public void setSex(String sex) {
this.sex = sex;
}
public Integer getPhone() {
return phone;
}
public void setPhone(Integer phone) {
this.phone = phone;
}
}
<servlet>
<servlet-name>PersonServlet</servlet-name>
<servlet-class>servlet.PersonServlet</servlet-class>
</servlet>
<servlet-mapping>
<servlet-name>PersonServlet</servlet-name>
<url-pattern>/personServlet</url-pattern>
</servlet-mapping>