画像パスをjqueryに置き換える方法-フロントエンドQ&A-php.cn

画像パスをjqueryに置き換える方法

WBOY

リリース： 2022-06-17 19:40:45

オリジナル

3362 人が閲覧しました

jquery では、attr() メソッドを使用して画像パスを置き換えることができます。このメソッドは、選択した要素の属性と値を設定または返すことができます。括弧内の最初のパラメータを"src" 属性。2 番目のパラメーターは新しい画像パスに設定でき、構文は "image element object.attr("src", "replaced image path");" です。

画像パスをjqueryに置き換える方法

このチュートリアルの動作環境: Windows10 システム、jquery3.6.0 バージョン、Dell G3 コンピューター。

jquery は画像パスを置き換えます

attr() メソッドは、選択した要素の属性と値を設定または返します。

このメソッドを使用して属性値を返すと、最初に一致した要素の値が返されます。

このメソッドを使用して属性値を設定すると、一致する要素に対して 1 つ以上の属性/値のペアが設定されます。

構文

属性の値を返す:

$(selector).attr(attribute)

ログイン後にコピー

属性と値を設定する:

$(selector).attr(attribute,value)

ログイン後にコピー

関数を使用して属性と値を設定します:

$(selector).attr(attribute,function(index,currentvalue))

ログイン後にコピー

複数の属性と値を設定します:

$(selector).attr({attribute:value, attribute:value,...})

ログイン後にコピー

attribute は属性の名前を指定します。

value 属性の値を指定します。

function(index,currentvalue) は、属性値をコレクションに返す関数を指定します。
index - 要素のインデックス位置を受け取りますコレクションの中で。
currentvalue - 選択した要素の現在の属性値を受け入れます。

例は次のとおりです:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>123</title>
<script src="js/jquery.min.js">
</script>
<script>
$(document).ready(function(){
    $("button").click(function(){
        $("img").attr("src","1118.02.png");
    });
});
</script>
</head>
<body>
<img src="1118.01.png" alt="Pulpit Rock">
<br>
<button>为图片替换路径</button>
</body>
</html>

ログイン後にコピー

出力結果:

画像パスをjqueryに置き換える方法