jQuery的load()调用json文件时报错VM231:1 Uncaught SyntaxError: Unexpected token / in JSON at position 0

最新推荐文章于 2023-09-17 23:52:21 发布

Alan • Lee

最新推荐文章于 2023-09-17 23:52:21 发布

阅读量5.8k

点赞数 1

CC 4.0 BY-SA版权

分类专栏： HTML、CSS、javaScript

本文链接：https://blog.youkuaiyun.com/qq1445654576/article/details/87528592

HTML、CSS、javaScript 专栏收录该内容

1 篇文章

订阅专栏

博客讲述了使用jQuery的load()函数加载包含注释的JSON文件时遇到的错误，即在JSON文件第一行存在注释导致SyntaxError。作者通过删除注释解决了问题，并展示了没有注释后能正常工作的代码。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

在这里插入图片描述
我百度了以下看到有人说请求的已经是json对象，无需解析，但是我最近在学jQuery的课程中老师的代码是这样写的，目的是要把json文件解析到html文件中。
我的json文件的语法是正确的，但是问题是我用Dreamwearer创建json文件时，它自动的在文件第一行加了注释，问题就在这里，有这一行注释就会报错，然后我把注释删掉就没报错了，可以正确解析json文件了。
第一行有注释，会报错，把注释删掉就可以了

把注释删掉后运行结果：
在这里插入图片描述

源代码：

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>AJAX访问中的load()方法</title>
<script src="../js/jquery-3.3.1.min.js"></script>
</head>

<body>
	<button id="btn">查看信息</button>
	<div id="content"></div>
<!--	<a href="../source/html/person.html"></a>-->
<script>
	$(function(){
		$("#btn").click(function(){
			//1. 获取txt文件内容
//			$("#content").load("../source/txt/hello.txt");
			
			//2. 获取html / xml文件内容
//			$("#content").load("../source/html/person.html p:eq(0)");	//获取p标签第一个值
//			$("#content").load("../source/html/person.html p:first");	//获取p标签第一个值
//			$("#content").load("../source/html/person.html p:last");	//获取p标签最后一个值
//			$("#content").load("../source/html/person.html p:odd");		//获取p标签奇数行的值
			
			//3. 获取json文件的内容
				var data = "../source/json/person.json";
				$("#content").load("../source/json/person.json",function(data){
				var jsonObj = JSON.parse(data);
				$(this).empty()
					.append("<p>姓名：<span>" + jsonObj.name + "</span></p>")
					.append("<p>年龄：<span>" + jsonObj.age + "</span></p>")
					.append("<p>性别：<span>" + jsonObj.sex + "</span></p>")
					.append("<p>学校：<span>" + jsonObj.school + "</span></p>");
			});
			
			
		});
	});
	
</script>
</body>
</html>

json文件：

{
	"name":"AlanLee",
	"age":22,
	"sex":"male",
	"school":"ZDXH"
}