JSON语法错误仅在浏览器中解析时发生

Question

我想说我对JS还很陌生，尽管我已经在其他编程语言中使用JSON一段时间了。

我一直在尝试将JSON中的一些数据传递给JS脚本，然后将其传递到HTML文件中。我现在的问题来自浏览器。最初我只打算在本地加载JSON，但我了解到我必须从web请求中获得它。据我所知，浏览器不支持本地加载。我把我的JSON放在GitHub上，并通过url引用了原始文件。然而，当我去调试时，我会得到一个语法错误，确实显示在Chrome的调试终端中。

未捕获的SyntaxError SyntaxError:(程序(("directory"\flashcards.json:2:14(处的意外令牌"：">

chrome终端中的错误图像

奇怪的是，我在VSCode中没有得到任何错误，而且我已经写了足够多次的JSON，知道它不是不正确的语法。

{
"flashcards":
[
{
"context": "Derivatives",
"front": "f´(sinx)",
"back": "cosx"
},
{
"context": "Derivatives",
"front": "f´(cosx)",
"back": "-sinx"
}
]
}

加载此JSON的代码如下所示。

function loadFlashcards() {
var request = new XMLHttpRequest();
request.open('GET', 'https://raw.githubusercontent.com/Spebby/Calculus-Revision/main/flashcards.json', true);
request.onload = function() {
if (request.status >= 200 && request.status < 400) {
// Success!
var jsonData = JSON.parse(request.responseText);
for (var i = 0; i < jsonData.flashcards.length; i++) {
var card = jsonData.flashcards[i];
var flashcard = new Flashcard(card.context, card.front, card.back);
console.log("Flashcard created: " + card.context, card.front, card.back);
cards.push(flashcard);
}
} else {
// We reached our target server, but it returned an error
console.log("Error loading flashcards");
}
};
request.onerror = function() {
// There was a connection error of some sort
console.log("Error loading flashcards");
};
request.send();
}

如果有人知道这个问题的原因，请告诉我。如果有更好的方法来做我想做的事情，我也非常乐意重构loadFlashcards((

Answer 1

Jaromanda X指出，我收到的错误表明错误实际上来自HTML端。他们认为这个错误是由于在脚本标记中加载JSON造成的。我甚至忘记我做过这个，但在检查并删除它后，错误消失了。再次感谢Jaromanda！