json其实是JavaScript对象表示法，数据可以使用json来表示。它看起来非常像对象字面量语法，但它并不是对象。
当json在服务和web浏览器之间传输的时候是以字符串形式来传送的，在将json对象转换成json字符串发送给服务器叫做序列化，在接受服务器发送过来的json字符串并且将其转换成json对象叫做反序列化。
在JavaScript中有两种转换成json的方法：
第一 eval()方法
var json = ‘[ { "name" : "卫庄", "age" : 20},{ "name" : "盖聂", "age" : 20},{ "name" : "谭慧东", "age" : 23}]‘; var box = eval(json);第二 JSON内建对象，但IE并不兼容，不过有大佬写了json2.js可以兼容IE，https://github.com/douglascrockford/JSON-js
序列化方法： stringify()
var json = [ { name : "卫庄", age : 20},{ name : "盖聂", age : 20},{ name : "谭慧东", age : 23}]; ???//模拟json对象var box = JSON.stringify(json); ????//stringify 将JavaScript原生值转换为json格式值反序列化方法：parse()
var json = ‘[ { "name" : "卫庄", "age" : 20},{ "name" : "盖聂", "age" : 20},{ "name" : "谭慧东", "age" : 23}]‘; ?//模拟获取json格式var box = JSON.parse(json); ?????//parse 将json转换为JavaScript原生值。下面是ajax加载json
// json文件text.json
{ ???"events" ?: [ ???????{ ???????????"location" : "San Francisco, CA", ???????????"date" : "May 1", ???????????"map" : "img/001.jpg" ???????}, ???????{ ???????????"location" : "Austin, TX", ???????????"date" : "May 15", ???????????"map" : "img/002.jpg" ???????}, ???????{ ???????????"location" : "New York, NY", ???????????"date" : "May 30", ???????????"map" : "img/003.jpg" ???????} ???]}
//js代码
???var xhr = window.XMLHttpRequest ? new XMLHttpRequest() : new ActiveXObject(‘Microsoft.XMLHTTP‘); //获取ajax对象 ???xhr.onreadystatechange = function () { ???????if (xhr.readyState == 4 && xhr.status == 200){ //响应成功后 ???????????var responseObject = JSON.parse(xhr.responseText); //获取的json字符串转换成json对象 ???????????var content = ‘<div class="header">‘; //将对象结合标签对 转换HTML格式 ???????????for (var i = 0; i < responseObject.events.length; i++){ ???????????????content += ‘<div class="date">‘; ???????????????content += ‘<div class="image">‘; ???????????????content += ‘<img src="‘ + responseObject.events[i].map + ‘" class="image‘ + (i+1) + ‘">‘; ???????????????content += ‘</div>‘; ???????????????content += ‘<p>‘ + responseObject.events[i].location + ‘</p>‘; ???????????????content += ‘<span>‘ + responseObject.events[i].date + ‘</span>‘; ???????????????content += ‘</div>‘; ???????????} ???????????content += ‘<div>‘; ???????????document.getElementById(‘container‘).innerHTML = content; //使用innerHTML的赋值方式，将其添加到页面中。 ???????} ???} ???xhr.open(‘get‘,‘json/text.json‘,true); //准备请求 ???xhr.send(null); //发送请求
Ajax加载json与序列化
原文地址：https://www.cnblogs.com/tanhuidong/p/8824784.html