属性　変更

attr('属性','属性のバリュー');

attr()はタグにある　src=""　alt="" class="" title="" などの属性のバリューを変更する時に使います。

例えば

<img class="myimage" src="/material/images/jQuery/disney.jpg" alt="disney" />

上にあるimgタグのsrc属性のバリューを変更したり、altの属性のバリューを変更する時に使います。

では、上のイメージをクリックするとsrc属性のバリューを変更してホンダ社のアシモが出るようにしてみましょう。

そうするためにはattr('','')の１番目は変更する属性の名を書きます、２番目は適用する属性のバリューを書きます。

var myimage = $('.myimage');
    myimage.click(function(){
    myimage.attr('src','/material/images/jQuery/asimo.png');
});

下にある東京ディズニーランドのシンデレラの城のイメージをクリックしてください、そうしたらイメージが変えます。

つまり、

<img class="myimage" src="/material/images/jQuery/disney.jpg" alt="disney" />
上のコードが
<img class="myimage" src="/material/images/jQuery/asimo.png" alt="disney" />
に変更されました。

では、直接やってみましょう。

<!doctype html>
<html>
<head>
<meta charset="utf-8" />
<title>COREASUR :: jQuery</title>
<script type="text/javascript" src="https://code.jquery.com/jquery-3.2.0.min.js" ></script>
<script>
$(function(){
    var myimage = $('.myimage');
        myimage.click(function(){
        myimage.attr('src','/material/images/jQuery/asimo.png');
    });
});
</script>
<style>
</style>
</head>
<body>
<img class="myimage" src="/material/images/jQuery/disney.jpg" alt="disney" />
</body>
</html>

その意外にもaタグのhrefの属性のバリューを変えたり、することもできます。＾＾

属性 変更

attr('属性','属性のバリュー');

属性　変更