0

我注意到在表示从服务器传递的 DOM 中的字符串作为 HTML 属性或全局变量方面存在一些差异。

有一个字符串是 JSON 编码的对象，其中包含特殊字符，并按以下方式设置此字符串：

<div id="my-id"
    data-opt='[{"id":"600900340","parent_id":"600900000","name":"\tCollector\u0027s Cars \u0026 Models","visible":"1","level":"3"}]'
></div>

<script>
    window.opt = '[{"id":"600900340","parent_id":"600900000","name":"\tCollector\u0027s Cars \u0026 Models","visible":"1","level":"3"}]';
</script>

现在用 js 检查它们：

;(function(window) {
    console.log(document.getElementById('my-id').dataset.opt);
    console.log(window.opt);
}(window))

输出：

[{"id":"600900340","parent_id":"600900000","name":"\tCollector\u0027s Cars \u0026 Models","visible":"1","level":"3"}]

[{"id":"600900340","parent_id":"600900000","name":" Collector's Cars & Models","visible":"1","level":"3"}]

为什么它们不同？

这是jsfiddle http://jsfiddle.net/9ss5M/3/

4

1 回答 1

2

因为在 JavaScript 字符串（包括 JSON）中具有特殊含义的\t和等转义序列在 HTML 属性值中是没有意义的。\u####

值得一提的是，HTML 中的转义序列采用实体引用的形式。以机智：

<div id="my-id"
    data-opt='[{"id":"600900340","parent_id":"600900000","name":"&#9;Collector&#x0027;s Cars &#x0026; Models","visible":"1","level":"3"}]'
></div>

更新的小提琴

当然，也可以选择按原样插入特殊字符，而无需使用转义序列。

于 2013-11-12T11:48:08.967 回答