1.xxx.json文中，里面可以定义 对象 和 数组。json文件中不能定义注释。注意：对象的属性名称必须用双引号引起来，字符串属性值必须用双引号引起来，不能使用单引号。
{
"name":"周杰伦",
"age":20,
"gender":"男",
"isVip":true
}2.通过ajax对象请求本地的json文件，获取里面保存的数据步骤：1.创建XMLHttpRequest对象，该对象就是ajax对象 。2..初始化请求:通过open()方法初始化请求，该方法的第一个参数是参请求方式，可选值包括：GET 和 POST. 该方法的第二个参数是请求地址：我们这里是请求一个本地的json文件。3.发送请求。4.通过onreadystatechange事件，监听请求数据的状态
3.示例代码：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>JSON格式的数据</title>
<style>
#stu{
width: 200px;
height: 200px;
border: 1px solid #ccc;
}
</style>
</head>
<body>
<div id="stu">
</div>
<script>
// 01.创建XMLHttpRequest对象，该对象就是ajax对象
let xhr = new XMLHttpRequest()
// 02.初始化请求
// 通过open()方法初始化请求，该方法的第一个参数是参请求方式，可选值包括：GET 和 POST
// 该方法的第二个参数是请求地址：我们这里是请求一个本地的json文件
xhr.open('GET','./data/stu.json')
// 03.发送请求
xhr.send()
// 04.通过onreadystatechange事件，监听请求数据的状态
xhr.onreadystatechange = function(){
// 读取状态值必须是4
if(xhr.readyState===4){
// 状态码必须是200
if(xhr.status===200){
// JSON.parse()方法，用于将json格式的字符串转为js对象
// responseText属性里面保存的就是后台返回的数据
let stu = JSON.parse(xhr.responseText)
let p1 = document.createElement("p")
p1.innerHTML = "姓名："+stu.name
let p2 = document.createElement("p")
p2.innerHTML = "年龄："+stu.age
let p3= document.createElement("p")
p3.innerHTML = "性别："+stu.gender
let p4 = document.createElement("p")
p4.innerHTML = "VIP："+stu.isVip
document.querySelector('#stu').appendChild(p1)
document.querySelector('#stu').appendChild(p2)
document.querySelector('#stu').appendChild(p3)
document.querySelector('#stu').appendChild(p4)
}
}
}
</script>
</body>
</html>版权声明：本文为zhou_nj原创文章，遵循CC 4.0 BY-SA版权协议，转载请附上原文出处链接和本声明。