在HTML属性中存储JSON的最佳方法？
在HTML属性中存储JSON的最佳方法？
提问于 2018-03-21 06:39:30
我需要将JSON对象放入HTML元素的属性中。
使用PHP和jQuery的编辑示例解决方案
将JSON写入HTML属性：
<?php
$data = array(
'1' => 'test',
'foo' => '<"bar/>'
);
$json = json_encode($data);
?>
<a href="#" data-json="<?php echo htmlentities($json, ENT_QUOTES, 'UTF-8'); ?>">CLICK ME</a>使用jQuery检索JSON：
$('a').click(function() {
// Read the contents of the attribute (returns a string)
var data = $(this).data('json');
// Parse the string back into a proper JSON object
var json = $.parseJSON($(this).data('json'));
// Object now available
console.log(json.foo);
});回答 2
Stack Overflow用户
发布于 2018-03-21 14:57:03
HTML不需要验证。
为什么不呢？验证非常容易，会发现很多错误。使用HTML 5data-*属性。
JSON对象可以是任意大小的(即巨大的)。
我没有看到任何关于属性大小的浏览器限制的文档。
如果确实遇到它们，则将数据存储在<script>。定义对象和映射元素id到那个对象中的。
如果JSON包含特殊字符怎么办？(例如，{test：‘<“myString/>’})
只需遵循在属性值中包含不受信任数据的常规规则。使用&和"(如果用双引号包装属性值)或'(如果用单引号包装属性值)。
但是，请注意，这不是JSON(它要求属性名称是字符串，字符串仅用双引号分隔)。
Stack Overflow用户
发布于 2018-03-21 16:37:54
取决于你把它放在哪里，
- 在
<div>正如你所问的，需要确保JSON不包含可以启动标记、HTML注释、嵌入式doctype等的HTML特例。你至少要避免<，和&以这样的方式，原始字符不会出现在转义序列中。 - 在
<script>元素，以确保JSON不包含结束标记。</script>或转义文本边界：<!--或-->。 - 在事件处理程序中，您需要确保JSON保留其含义，即使它具有类似HTML实体的内容，并且不会打破属性边界(
"或')
对于前两种情况(以及旧的JSON解析器)，你应该对U+2028和U+2029进行编码，因为它们是JavaScript中的换行符，即使它们在JSON中未编码的字符串中也是允许的。
为了正确起见，你需要避免\和JSON引号字符，并且始终编码NUL。
如果HTML可能不需要内容编码，则应该对其进行编码并组织UTF-7 attacks。
在任何情况下，下列转义表都可以工作：
- NUL->
\u0000 - Cr->
\n或\u000a - LF->
\r或\u000d "->\u0022&->\u0026'->\u0027+->\u002b/->\/或\u002f<->\u003c>->\u003e\->\\或\u005c- U+2028->
\u2028 - U+2029->
\u2029
所以文本的JSON字符串值Hello, <World>!在最后加上一个换行符"Hello, \u003cWorld\u003e!\r\n"。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/-100007708
复制相关文章
相似问题