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를 할당하면 쉽게 선택하고 조작할 수 있습니다. 자바스크립트를 사용합니다. getElementById 메소드는 지정된 ID를 가진 HTML 요소를 반환합니다. 그런 다음 src 속성에 액세스하고 새 소스 경로를 직접 할당할 수 있습니다.

참고:

이 접근 방식을 사용하면 소스를 변경하기 위해 여러 번 클릭할 필요가 없습니다. 이전 시도입니다.

위 내용은 JavaScript를 사용하여 이미지 태그의 `src` 속성을 동적으로 변경하는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!