目錄
四、在實際的開發中有兩種數據交換格式,使用最多的一個是JSON,另一個是XML。
一、思維導圖
二、什麼是Json,有什麼用?
JavaScript Object Notation 簡稱JSON(數據交換格式)
主要作用:進行數據交換,系統A與系統B交換數據都是採用JSON
三、JSON是一種輕量級的數據交換格式,特點是:
(1)體積小,易解析。
四、在實際的開發中有兩種數據交換格式,使用最多的一個是JSON,另一個是XML。
XML體積量大,難解析,語法結構準確。
XML和HTML有一個共同的父親:SGML(標準通用的標記語言)
HTML主要做頁面展示:語法鬆散,很隨意。XML主要做數據存儲和數據描述,所以語法相當嚴格。
五、創建Json對象(語法格式)、訪問Json對象的屬性
var jsonObj = {
"屬性名":"屬性值"
"屬性名":"屬性值"
"屬性名":"屬性值"
}
Var studentiObj={
"sno":"110"
"sname":"張三"
"sex":"男"
};
//訪問Json對象的屬性
alert(studentObj.sno + "," + studentObj.sname + "," + student.Sex);
//之前沒有使用JSON的時候,定義類,創建對象,訪問對象的屬性。
Student = function(){
this.sno = sno;
this.sname = sname;
this.sex = sex;
}
var stu = new student("111","李四","男");
alert(stu.sno + "," + stu.sname + "," + stu.sex);
六、如何創建Json數組,以及遍歷數組
//Json數組
var student = [
{"sno":"110","sname":"張三","sex":"男"},
{"sno":"120","sname":"李四","sex":"男"},
{"sno":"130","sname":"王三","sex":"男"},
];
//遍歷
for(var i=0 ; i< student.length; i++)
{
var stuObj = student[i]
alert(stuObj.sno + "," + stuObj.sname + "," + stuObj.sex);
}
七、Eval函數
(1)作用:
把字符串當做一段JS代碼解釋並執行。
window.eval("val i = 100;");
alert("i=" + i);
//java連接數據庫,查詢數據之後,將數據在java程序中拼接成JSON格式的“字符串”,將json格式的字符串相應到瀏覽器。
//也就是說java相應到瀏覽器上的僅僅是一個"JSON格式的字符串",還不是一個Json對象
//可以使用eval函數,將json格式的字符串轉換成json對象。
Var fromJava = "{"name":"zhangsan","password":123};
這個時候如果不轉移就被當成雙引號和前面的雙引號匹配了。
//將以上的json格式的字符串轉化成json對象。
Window.eval("val jsonObj =" +fromJava);
//訪問json對象
Alert(jsonObj.name + "," +jsonObj.password);//在前端取數據
八、[]和{}有什麼區別?
(1)在JS當中,[]和{}有什麼區別?
[]代表的是數組,{}是JSON
java中的數組:int [] arr = {1,2,3,4,5};
JS中的數組:var arr = [1,2,3,4,5];
JSON: var jsonObj ={"email":"[email protected]","age":25};
JSON是一鍾數據交換格式,在JSON中被當成一種對象。
(2)//訪問JSON的兩種格式
Alert( json.username);
Alert(json["username"]);
九、例子:如何循環JSON將其導入到table中
<!doctype html>
<html>
<head>
<title>eval函數</title>
</head>
<body>
<script type="text/javascript">
//有這些Json數據
var data = {
"total":4,
"emps":[
{"empno":7369,"ename":"SMITH","sal":800.0},
{"empno":7369,"ename":"SMITH","sal":800.0},
{"empno":7369,"ename":"SMITH","sal":800.0},
{"empno":7369,"ename":"SMITH","sal":800.0},
]
};
//希望把數據展示到table裏面
window.onload=function(){
var displayBtnElt = document.getElementById("displayBtn");
displayBtnElt.onclick=function(){
var emp = data.emps;
var html = "";
console.log(emp[0].empno);
for(var i =0;i<emp.length;i++){
html +="<tr>";
html +="<td>"+emp[i].empno+"</td>";
html +="<td>"+emp[i].ename+"</td>";
html +="<td>"+emp[i].sal+"</td>";
html +="</tr>";
}
document.getElementById("emptbody").innerHTML=html;
document.getElementById("count").innerHTML=data.total;
}
}
</script>
<input type="button" value="顯示員工信息列表" id="displayBtn" />
<h2>員工列表</h2>
<hr>
<table border="1px" width="50%">
<tr>
<th>員工編號</th>
<th>員工名字</th>
<th>員工薪資</th>
</tr>
<tbody id="emptbody">
</tbody>
</table>
總共<span id="count">0</span>條數
</body>
</html>
十、 總結
Json的循環和eval函數都挺重要的,在項目中也都是特別的常見的。