使用jQuery更新data属性的值

Question

我有以下HTML代码:

<a class="toggle" href="#toggle">
    <img src="app/css/images/tock.png" alt="No" data-id="4" data-block="1">
</a>

我想使用jQuery 更新src和data-block属性的值.我该怎么做呢？

更新:因为我有很多图像元素,我想通过使用更新特定图像的值data-id.

Answer 1

$('.toggle img').data('block', 'something');
$('.toggle img').attr('src', 'something.jpg');

使用jQuery.data和jQuery.attr.

为了便于理解,我将它们分别展示给你.

Answer 2

$('.toggle img').each(function(index) { 
    if($(this).attr('data-id') == '4')
    {
        $(this).attr('data-block', 'something');
        $(this).attr('src', 'something.jpg');
    }
});

要么

$('.toggle img[data-id="4"]').attr('data-block', 'something');
$('.toggle img[data-id="4"]').attr('src', 'something.jpg');

Answer 3

我想更改 div 的宽度和高度。数据属性没有改变它。相反，我使用：

var size = $("#theme_photo_size").val().split("x");
$("#imageupload_img").width(size[0]);
$("#imageupload_img").attr("data-width", size[0]);
$("#imageupload_img").height(size[1]);
$("#imageupload_img").attr("data-height", size[1]);

当心：

$("#imageupload_img").data("height", size[1]); //did not work

没有设置

$("#imageupload_img").attr("data-height", size[1]); // yes it worked!

这已经设置了。

Answer 4

$('.toggle img').data('block', 'something').attr('src', 'something.jpg');