Bagaimana untuk Mengubah Atribut `src` Teg Imej Secara Dinamik Menggunakan JavaScript?

Menukar Atribut Sumber Tag Imej melalui JavaScript

Pertanyaan:

Bagaimana saya boleh mengubah suai atribut src bagi teg img secara dinamik menggunakan JavaScript?

Contoh:

Pertimbangkan teg img dengan laluan src awal "../template/edit.png". Matlamatnya ialah untuk menukar laluan ini kepada "../template/save.png" apabila teg diklik.

Kod HTML dengan ID:

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

Kod JavaScript dengan getElementById:

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

Penjelasan:

Dengan memberikan id kepada teg img, anda boleh memilih dan memanipulasinya dengan mudah menggunakan JavaScript. Kaedah getElementById mengembalikan elemen HTML dengan id yang ditentukan. Anda kemudian boleh mengakses sifat srcnya dan menetapkan laluan sumber baharu secara terus.

Nota:

Pendekatan ini mengelakkan keperluan untuk berbilang klik untuk menukar sumber seperti yang dilihat dalam percubaan anda sebelum ini.

Atas ialah kandungan terperinci Bagaimana untuk Mengubah Atribut `src` Teg Imej Secara Dinamik Menggunakan JavaScript?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!