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

问题描述

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

我已经通过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>

标签： javascriptjson

字符串连接

周围的字符串 using"并且'不能延伸到多行，因此必须将每行分开，然后将它们连接起来。例子：

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

console.log(myJSON);

模板文字

在 ES6 中，添加了模板文字，允许字符串跨越多行，前提是您使用`而不是"or '。例子：

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);