javascript - 访问 JQuery data-json 元素

Question

我的页面上有以下 anchor :

<a href="#" data-json='{"first":"SGVsbG8=","last":"V29ybGQ=","mail":"aGVsbG9Ad29ybGQuY29t","favorite":"eWVz","answer":"VGhpcyBpcyBteSBhbnN3ZXJzIQ==","id":"MQ==","read":"yes"}'>Hello</a>

<a href="#" data-json='{"first":"SGVsbG8=","last":"V29ybGQ=","mail":"aGVsbG9Ad29ybGQuY29t","favorite":"eWVz","answer":"VGhpcyBpcyBteSBhbnN3ZXJzIQ==","id":"MQ==","read":"no"}'>Hello</a>

我想要的是更改 data-json read值为 no对于 first 的 anchor 值为 SGVsbG8=

我尝试了以下但没有成功:

($('.usr-list a').data('json').first == 'SGVsbG8=').each(function(i){$(this).data('json').read('no')});

可以这样做吗？

Answer 1

是的，这是可能的。比较结果 ($('.usr-list a').data('json').first == 'SGVsbG8=') 是一个 bool 值，没有 every 方法，为了过滤元素，您应该迭代它们并读取它们的 data-json 属性:

$('a').each(function () {
    var o = $(this).data('json');
    if (o.first === 'SGVsbG8=') {
        o.read = 'no';
    }
});

请注意，上面的代码片段不会更改 data-json 属性。解析 data-* 属性后的 jQuery data 方法将它们存储在内部。如果您想在修改属性后更改属性，您应该对对象进行 JSON 编码并重置属性。

this.setAttribute('data-json', JSON.stringify(o));