如何仅使用.attr（）（或等效的）从数据属性获取json

Question

我觉得我被困在最简单的事情上，但我似乎无法找到解决问题的方法。

我有一个json数组，我希望通过div上的数据属性传递给我的javascript：

<div id="scope" data-json='["apple","pear"]'></div>

我的问题是，我只能使用任何东西来获得该值。但是数据（＆＃39; json＆＃39;）。

这里有一个我正在寻找的东西：https://jsfiddle.net/Wurielle/p17d71m0/1/

您可以在控制台中看到使用.data（）进行日志记录会返回一个json数组（这正是我需要的），但使用.attr（）进行日志记录只返回纯文本。 不幸的是，由于多种原因，我不能使用.data（）。

我考虑过使用JSON.stringify和JSON.parse，但我无法获得与.data（）选项相同的结果。

有什么方法可以使用除.data（）之外的任何东西从数据属性中获取json吗？

Answer 1

var article = document.getElementById('scope');
var dataset = article.dataset.json;
JSON.parse(dataset);

Answer 2

完全抛弃jQuery，我们得到与.data()相同的结果：

＆＃13;

＆＃13;

var json    = document.getElementById('scope').getAttribute('data-json');
var decoded = JSON.parse(json);

console.log("JS-only:");
console.log(decoded);

console.log("jQuery:");
console.log($('#scope').data('json'));

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="scope" data-json='["MIL","QPL"]'></div>

＆＃13;

＆＃13;

＆＃13;

Answer 3

您已尝试function search_rules($query) { if ($query->is_search) { $query->set('post_type', 'product'); } return $query; } add_filter('pre_get_posts','search_rules'); ，这就是答案。

JSON.parse()

console.log($('#scope').attr('data-json'));

console.log($('#scope').data('json'));

console.log(JSON.parse($('#scope').attr('data-json')));