<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script src="js/jquery-3.1.0.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript">
$(function() {
$('button').click(function() {
$.get('title.json',
//使用.get()請求json數據時，jquery會把返回的數據包裝為一個對象，這樣不需要我們繼續轉換
function(data) {
//當請求成功，在回調函數中解析數據
//var resultObj = JSON.parse(data);
var newArr = data.news;
//console.log(newArr)
//遍歷數組，取對象，取對象的屬性值
for(var obj of newArr) {
//在獲取到的對象中遍歷對象的屬性值
console.log(obj);
//for in 在遍歷對象時，取到的是對象屬性數組的下標，所以再通過這個下標訪問對象屬性時，必須使用[] 而不能用點語法
//for(var newObj in obj){
//console.log(obj[newObj]);
//使用jsDOM操作創建標簽，并拼接文檔內容
var h = document.createElement("h3");
h.innerHTML = obj.title;
var des = document.createElement("p");
des.innerText = obj.des;
var body = $('body');
body.append(h);
body.append(des);
//
//}
}
});
})
});
</script>
</head>
<body>
<button>點雞</button>
</body>
</html>
