jQuery $.ajax请求本地文件数据的返回值是字符串的解决方法

使用 $.ajax 请求本地静态文件数据,数据明明是JSON格式,但返回值的数据类型却是字符串,这是因为在数据传输过程中,JSON是以文本(即字符串)的形式传递的,所以返回的值也就是字符串类型,因此在操作返回的JSON数据时,需要先把JSON字符串转换为JSON对象,也就是解析,即反序列化(简单地理解)。

涉及基础

简单地理解,序列化就是把JSON对象转化成JSON字符串类型的过程;反序列化则是把JSON格式的字符串转化为JSON对象的过程。

在jQuery中可以使用 $.parseJSON(data) 实现标准格式的JSON字符串反序列化为JSON对象。

代码示例

json.txt文件数据如下

[
	{
		"title": "带完整省市json数据的jquery省市二级联动代码", 
		"datetime": "2022-7-21", 
		"url":"https://www.tddx.net/post-641.html"
	},
	{
		"title": "原生javascript获取指定对象所有子孙元素集合的代码", 
		"datetime": "2022-4-25", 
		"url":"https://www.tddx.net/post-636.html"
	}
]

使用$.ajax请求该文件的数据

$.ajax({
	url: 'json.txt',
	async: false,
	type:'get',
	error : function(result, status, xhr) {
	   alert('数据请求失败');
	},
	success: function (result, status, xhr) {		
		var events = $.parseJSON(result);
		var events = JSON.parse(result);//ECMAScript 5中的方法,推荐
		console.log(events);
	}
});

附:

推荐使用javascript的反序列方法 JSON.parse()(ECMAScript 5),序列化方法 JSON.stringify()

关键词: json ajax jquery教程