Wie ändere ich das Attribut „src' eines Bild-Tags mithilfe von JavaScript dynamisch?

Ändern des Quellattributs eines Bild-Tags über JavaScript

Abfrage:

Wie kann ich das src-Attribut von ändern? ein IMG-Tag dynamisch mit JavaScript?

Beispiel:

Betrachten Sie ein IMG-Tag mit einem anfänglichen Quellpfad von „../template/edit.png“. Ziel ist es, diesen Pfad in „../template/save.png“ zu ändern, wenn auf das Tag geklickt wird.

HTML-Code mit ID:

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

JavaScript-Code mit getElementById:

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

Erklärung:

Durch Zuweisen einer ID zum img-Tag können Sie es einfach auswählen und bearbeiten mit JavaScript. Die Methode getElementById gibt das HTML-Element mit der angegebenen ID zurück. Sie können dann auf die Eigenschaft „src“ zugreifen und den neuen Quellpfad direkt zuweisen.

Hinweis:

Dieser Ansatz vermeidet die Notwendigkeit mehrerer Klicks, um die Quelle zu ändern, wie in gezeigt Ihr vorheriger Versuch.

Das obige ist der detaillierte Inhalt vonWie ändere ich das Attribut „src' eines Bild-Tags mithilfe von JavaScript dynamisch?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!