如何使用javascript更改元素中的类名和数据

How to change class name and data in element using javascript?

本文关键字:数据 元素 何使用 javascript      更新时间:2023-09-26

如何使用javascript更改元素中的类名和数据?

现在我可以将类名从 class="xxx" 更改为class="yyy"没关系。

但我想改变

<img src="http://iconshow.me/media/images/Mixed/Free-Flat-UI-Icons/png/128/heart-24-128.png"/>

<img src="http://image.ohozaa.com/i/c70/cLBh71.png"/>

这是我的演示

http://jsfiddle.net/dFp6f/8/

这是JavaScript代码

<script>
function myFunction() {
    $("#demo").addClass("yyy").removeClass("xxx");
}
</script>

怎么办?

您可以使用attr方法来更改图像 src:

function myFunction() {
    $("#demo").addClass("yyy").removeClass("xxx");
    $("img").attr("src", "http://image.ohozaa.com/i/c70/cLBh71.png");
}

函数中的小提琴更新中检查更新的代码

function myFunction() {
   $("#demo").addClass("yyy").removeClass("xxx");
   $("#demo img").attr('src','http://image.ohozaa.com/i/c70/cLBh71.png');
}

你可以这样使用。

function myFunction() {
    $("#demo").addClass("yyy").removeClass("xxx").find('img').prop('src', 'http://image.ohozaa.com/i/c70/cLBh71.png');
}

我想你想要这样的东西:

var src = "http://image.ohozaa.com/i/c70/cLBh71.png";
$('img').attr('src', function(){
    return src;
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<img src="http://iconshow.me/media/images/Mixed/Free-Flat-UI-Icons/png/128/heart-24-128.png"/>

function myFunction() {
     $("#demo").addClass("yyy").removeClass("xxx");
     $("#demo img").attr("src","http://image.ohozaa.com/i/c70/cLBh71.png");
}