<!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>
