将JSON存储在HTML属性中的最佳方法？

  • Z时代
  • 2024-01-10
  • 分类：问答

我需要将JSON对象放入HTML元素的属性中。

昆汀回答： 将JSON存储在data-*有效HTML5

的attribute中。

  2. {foo: '<"bar/>'}

昆汀回答：按照常规惯例，将JSON字符串放入属性之前，先对其进行编码。 对于PHP，请使用

htmlentities()函数。

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

回答：

HTML不必验证。

为什么不？验证真的很容易进行质量检查，它会捕获很多错误。使用HTML 5 data-*属性。

JSON对象可以是任何大小（即巨大）。

我还没有看到有关属性大小的浏览器限制的任何文档。

如果确实遇到了问题，请将数据存储在中<script>。定义一个对象，然后将ids 映射到该对象中的属性名称。

如果JSON包含特殊字符怎么办？（例如{test：’<“ myString />’}）

只需遵循将不可信数据包含在属性值中的常规规则即可。使用&amp;和&quot;（如果将属性值用双引号引起来）或&#x27;（如果将属性值用单引号引起来）。

但是请注意，它不是JSON（这要求属性名称为字符串，并且字符串只能用双引号分隔）。

以上是 将JSON存储在HTML属性中的最佳方法？ 的全部内容， 来源链接： utcz.com/qa/427879.html

回到顶部