이미지 태그를 이용할 시 참조하는 이미지가 없을 경우를 대비해 대체할 이미지를 보여주는 기능이 있다.
바로 onError라는 속성인데 작성하는 방식은 아래와 같다.
<img src="aaa.domain.com/bbb.jpg" onError=this.src="aaa.domain.com/ccc.png">
하지만, 이 부분에서도 무한루프에 빠지는 허점이 있다.
bbb.jpg에 접근하였더니, 존재하지 않아 ccc.png에 접근했는데
이 파일 또한 존재하지 않았을 경우 다시 onError를 호출하여 또 파일을 찾는 것이었다.
<img src="aaa.domain.com/bbb.jpg" onError="this.onerror=null; this.src='aaa.domain.com/ccc.png'">
이렇게 onError부분에 코딩하게 되면, 기본 src의 참조오류로 인한 onError 호출할 때 null로 처리되며..
이후 error의 src가 참조를 못하였을 경우, 앞서 null로 처리하였기 때문에 무한루프에서 벗어날 수 있다.
혹시, 잘못된 부분이나, 더 좋은 정보가 있다면 공유 부탁합니다.