javascript - 使用嵌套的 JSON 对象给我控制台错误

标签 javascript json

使用 JSON 嵌套对象,在 javascript 控制台中运行时出现错误“JSON3.html:11 Uncaught SyntaxError: Invalid or unexpected token”

enter image description here

我已经通过 https://jsonformatter.org/json-viewer 验证了 JSON,看起来没问题。输出只是我的 h2 标签中的文本。我错过了什么? 这是代码。

<!DOCTYPE html>
<html>
<body>

<h2>Testing JSON .</h2>

<p id="demo"></p>

<script>

var myJSON = '{
  "LevelOne": {
    "LevelTwo": {
      "location": {
        "campus": "SouthWest",
        "building": "Biggest",
        "floor": "1st",
        "room": "101"
      },
      "quantity": "1",
      "section": "ABC",
      "task": "abc123456zyx"
    }
  }
}';
var myObj = JSON.parse(myJSON);
document.getElementById("demo").innerHTML = myJSON.LevelOne.LevelTwo.location;
</script>

</body>
</html>

最佳答案

字符串连接

使用 "' 包围的字符串不能跨多行,所以必须将每一行分开然后连接它们。示例:

var myJSON = '{' +
  '"LevelOne": {' +
    '"LevelTwo": {' +
      '"location": {' +
        '"campus": "SouthWest",' +
        '"building": "Biggest",' +
        '"floor": "1st",' +
        '"room": "101"' +
      '},' +
      '"quantity": "1",' +
     '"section": "ABC",' +
      '"task": "abc123456zyx"' +
    '}' +
  '}' +
'}';

console.log(myJSON);

模板文字

在 ES6 中,添加了模板文字,允许字符串跨越多行,前提是您使用 ` 而不是 "'. 示例:

var myJSON = `{
  "LevelOne": {
    "LevelTwo": {
      "location": {
        "campus": "SouthWest",
        "building": "Biggest",
        "floor": "1st",
        "room": "101"
      },
      "quantity": "1",
      "section": "ABC",
      "task": "abc123456zyx"
    }
  }
}`;

console.log(myJSON);

从 JSON 中删除新行

使 JSON 1 行变高的一种简单方法是在浏览器的控制台执行 JSON.stringify(json)

使用普通的 JSON

您可以只使用 JSON 的普通对象表示法而不是 JSON,然后如果您愿意,可以使用 JSON.stringify 将其转换回字符串。示例:

var myJSON = {
  "LevelOne": {
    "LevelTwo": {
      "location": {
        "campus": "SouthWest",
        "building": "Biggest",
        "floor": "1st",
        "room": "101"
      },
      "quantity": "1",
      "section": "ABC",
      "task": "abc123456zyx"
    }
  }
};

console.log(JSON.stringify(myJSON));
console.log(myJSON);

关于javascript - 使用嵌套的 JSON 对象给我控制台错误,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/58013368/

相关文章:

javascript - 如何使 Canvas html 中的区域可放置?

javascript - 如何替换已排序的 JS 数组中的值?

javascript - 销毁 var 中包装的实例

python - 如何正确使用Flask的jsonify()返回json?

javascript - (UNtermated String Literal)如何在ajax中打印下拉列表中接收到的json数据

javascript - 尝试使用 ts-loader 时 Webpack 抛出错误

javascript - 使用 ng-dygraphs 时如何从底层 dygraphs 中获取 isZoomed ?

python - SQLAlchemy中,dict更新方法如何与ORM交互?

ruby - 使用 Elasticsearch 处理超出内存限制的文档处理

ios - iTunes API - JSON 数组错误 Swift4,要求。在 Collection View 中显示为数组