본문 바로가기

IT노트(구)/JavaScript

이미지 로딩 실패했을 때 다른 이미지 띄우는 방법(onerror 이용)

img에는 onerror 옵션이 있다.

이미지가 정상적으로 로딩이 되지 않을 때(에러가 났을 때!)

특정 자바스크립트가 자동으로 실행되도록 만들 수 있다!

이 원리를 이용하면

로딩에 실패했을 때 에러 표시 이미지를 띄울 수 있다.

다음과 같이 처리하면 된다!(this.src를 통해 이미지를 출력하는 원리이다!)


<img src="/images/title01.png" onerror="this.src='/images/image_not_exist.png'" />