使用HTML5数据属性,可以将HTML存储在HTML中,如下面的HTML所示.这适用于字符串键：值对,但我无法弄清楚如何使值包括特殊字符或HTML.

给出问题的JSON对象的一部分是：不能对< b> own< / b>进行投票.评论(也对像这样的更复杂的HTML块感兴趣：< span style =“text-decoration：underline”own< / span>.这是一个JSFiddle for the code below.

JS：

$('button').on('click', function () {
  var $this=$(this), data=$this.data('data');
     $('#output').html(data.message);
});

HTML：

<button type='button' data-data='{"type": "voting", "message": "Can't vote on <span style="text-decoration:underline" own</span> review"}'></button>
<div id='output'></div>

解决方法:

你需要escape the HTML,特别是在这个例子中,&和用于引用属性值的字符(“或”)：

<button type='button' data-data='{"type": "voting", "message": "Can&#39;t vote on <b>own</b> review"}'></button>

要么：

<button type='button' data-data='{"type": "voting", "message": "Can&#39;t vote on <span style=&#39;text-decoration:underline&#39;>own</span> review"}'></button>