JavaScript を使用して画像タグの `src` 属性を動的に変更する方法

JavaScript を使用して画像タグのソース属性を変更する

クエリ:

画像タグの src 属性を変更するにはどうすればよいですかJavaScript を使用して img タグを動的に使用するには?

例:

初期 src パスが「../template/edit.png」である img タグを考えてみましょう。目標は、タグがクリックされたときにこのパスを「../template/save.png」に変更することです。

ID の HTML コード:

<code class="html"><a href="#" onclick="edit()"><img src="../template/edit.png" id="edit-save" alt="Edit" /></a></code>

getElementById を使用した JavaScript コード:

<code class="javascript">document.getElementById("edit-save").src = "../template/save.png";</code>

説明:

img タグに ID を割り当てることで、簡単に選択して操作できますJavaScriptを使用して。 getElementById メソッドは、指定された ID を持つ HTML 要素を返します。その後、その src プロパティにアクセスして、新しいソース パスを直接割り当てることができます。

注:

この方法では、次のようにソースを変更するために複数回クリックする必要がなくなります。前回の試み。

以上がJavaScript を使用して画像タグの `src` 属性を動的に変更する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。