一尘不染

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

php

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

  1. HTML不必验证。

昆汀回答: 将JSON存储在data-*有效HTML5
attribute中

  1. JSON对象可以是任何大小-即巨大

  2. 如果JSON包含特殊字符怎么办? 例如 {foo: '<"bar/>'}

昆汀回答:按照常规惯例,将JSON字符串放入属性之前,先对其进行编码。 对于PHP,请使用
htmlentities() 函数。


编辑-使用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);

});

阅读 792

收藏
2020-05-29

共1个答案

一尘不染

HTML不必验证。

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

JSON对象可以是任何大小(即巨大)。

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

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

如果JSON包含特殊字符怎么办?(例如{test:’<“ myString />’})

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

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

2020-05-29