웹 페이지 상단 타이틀 이미지 가져오기 및 에러 시 대처법

URL 을 이용하여 모든 웹사이트의 상단 타이틀 이미지 ( 로고, Favicon.ico ) 을 가져와서

a Link 로 보여주는 것보다 이미지로 보여주고 싶었습니다.

favicon 이미지를 가져오는 것은 어렵지 않았습니다.

해당 사이트 url/favicon.ico라고 치면 이미지가 나와요.

이 이미지를 이용하여 배너 또는 링크를 만들고 싶었어요!

<a href="www.google.com">
<img src="www.google.com/favicon.ico"
onerror="imgError(this);"
</a>

이런식으로 작성하면 해당 사이트의 favicon.ico 로 링크를 제작할 수 있습니다!!

혹시나 favicon.ico 가 존재하지 않는 사이트(404 Error 가 납니다.)를 위해 onerror 속성을 이용하여 함수를 정의하시면

function imgError(image){
    image.style.display = 'none';
}

이런식으로 아예 보이지 않도록 만들거나 추가적인 작업을 할 수 있습니다 ^ㅡ^