Question

我查了很多问题，但没有看到解决方案。

我有JSON，它是STRINGIFIED（包含HTML）。此JSON作为字符串存储在元素上。当我尝试JSON.parse(str)我收到错误时

我知道错误是由特殊符号\ n \ t等引起的，必须进行转义。那么如何解析这个JSON字符串并将其作为对象。

＆＃13;

var obj = {
  "blocks": [{
    "frames_content": "<div id=\"page\" class=\"page\">\n    \n    \t<div class=\"container\" id=\"divider1\">\n    \n    \t\t<div class=\"col-md-12\">\n    \n    \t\t\t<hr class=\"dashed\" data-selector=\"hr.dashed\" style=\"outline: none; cursor: inherit;\">\n    \t\n    \t\t</div><!-- /.col -->\n    \t\n    \t</div><!-- /.container -->\n    \n    </div>",
    "frames_sandbox": false,
    "frames_loaderFunction": "",
    "frames_height": 162,
    "frames_original_url": "/static/admin-users/pages/elements/divider1.html"
  }]
};
document.getElementById("debug").innerHTML = JSON.stringify(obj);
var str = document.getElementById("debug").innerHTML;
var x = JSON.parse(str);
console.log(x);

＆＃13;

<div id="debug"></div>

＆＃13;

=====更新

如果我用.text（）工作

读取元素

我还有一个场景，我不知道如何解决

<script>
var str = '{"pages":{"index":{"blocks":[{"frames_content":"<div id=\"page\" class=\"page\">\n    \n    \t<div class=\"container\" id=\"divider1\">\n    \n    \t\t<div class=\"col-md-12\">\n    \n    \t\t\t<hr class=\"dashed\" data-selector=\"hr.dashed\" style=\"outline: none; cursor: inherit;\">\n    \t\n    \t\t</div><!-- /.col -->\n    \t\n    \t</div><!-- /.container -->\n    \n    </div>","frames_sandbox":false,"frames_loaderFunction":"","frames_height":162,"frames_original_url":"/static/admin-users/pages/elements/divider1.html"}]}},"responsiveMode":"desktop"}';

var obj = JSON.parse(str);
</script>

我应该用REGEX逃脱它们还是什么？什么是最好的方式？

Answer 1

jQuery .html()会自动将引号等内容转换为HTML实体形式。实际放入DOM的HTML如下所示：

{"blocks":[{"frames_content":"<div id="\&quot;

注意"，它在浏览器中显示时将是双引号。它是一个HTML实体。

要在没有HTML实体的情况下从DOM中提取您想要的代码，请使用.text()代替.html()

var str=$("#debug").text();

此外，我建议您熟悉调试代码。 console.log() - str变量的内容可以帮助您了解正在发生的事情。

Answer 2

使用HTML解析器和序列化程序不会保持原始字符串不变。

您应该使用JSON.parse的未更改结果来致电JSON.stringify(obj)。

var obj = {
  "blocks": [{
    "frames_content": "<div id=\"page\" class=\"page\">\n    \n    \t<div class=\"container\" id=\"divider1\">\n    \n    \t\t<div class=\"col-md-12\">\n    \n    \t\t\t<hr class=\"dashed\" data-selector=\"hr.dashed\" style=\"outline: none; cursor: inherit;\">\n    \t\n    \t\t</div><!-- /.col -->\n    \t\n    \t</div><!-- /.container -->\n    \n    </div>",
    "frames_sandbox": false,
    "frames_loaderFunction": "",
    "frames_height": 162,
    "frames_original_url": "/static/admin-users/pages/elements/divider1.html"
  }]
};
var str = JSON.stringify(obj);
document.getElementById('debug').innerHTML = str;
console.log(JSON.parse(str));

<div id="debug"></div>

Answer 3

请使用：

var str=$("#debug").text(); // not html()

这将解决您使用反序列化JSON的问题。

JSON.parse（）无法使用HTML解析字符串

3 个答案: