• 회원가입
  • 로그인
  • 구글아이디로 로그인

[DOM_Event] JS - error 이벤트 (= onerror 속성) - 외부파일로드 중 에러발생시 실행 (= 에러 이벤트 = 에러 속성)

목차
  1. error 예제 - 이미지 로드 실패 시 함수 실행
  2. error 예제 - 동영상 로드 실패 시 함수 실행
  3. error 정의
  4. error 구문
  5. error 예제 - 자기소개 이미지 사용/대체 에러 시 입력 문자열 출력

 

error 예제 - 이미지 로드 실패 시 함수 실행

 

<img src="logo.gif" onerror="hz()">


<script>

function hz() {

  alert('이미지 로드 실패');

}

</script>

 

 

error 예제 - 동영상 로드 실패 시 함수 실행

 

<script>

var mv = document.getElementById("hz");

mv.onerror = function() {

    alert("동영상 로드 실패");

};

</script>

 

 

error 정의

 

외부 파일 (예 : 문서, 이미지, 비디오 등) 로드 중 오류 발생 이벤트.

 



1.
모든 브라우저 지원

2.
미디어 로드 실패와 관련 있는 이벤트

  • abort 이벤트 - 미디어 로드 중단 이벤트
  • emptied 이벤트 - 미디어 빈 경우 이벤트
  • stalled 이벤트 - 브라우저가 미디어 사용 불가 이벤트
  • suspend 이벤트 - 미디어 데이터 로딩 일시 중단 이벤트

 
3.



error 구문

 

HTML 속성 방식

<element onerror="jsScript">


JS 속성 방식

object.onerror=function(){jsScript}; 


JS 메서드 방식

object.addEventListener("error", jsScript);

 

※ addEventListener() 메서드는 IE9 이상 작동.
 

error 예제 - 자기소개 이미지 사용/대체 에러 시 입력 문자열 출력

 

분류 제목
DOM_Style JS - animationPlayState 속성 - 애니재생상태 (= 애니작동상태설정 = 움직임 재생/멈춤 …
DOM_Style JS - background 속성 ★ - (배경색/배경이미지) 설정/반환 (= background속성 / 백…
DOM_Style JS - backgroundAttachment 속성 ★ - 배경이미지고정 설정/반환
DOM_Style JS - backgroundColor 속성 ★ - 배경색 설정/반환. (= backgroundColor속성 …
DOM_Style JS - backgroundImage 속성 ★ - 배경이미지 설정/반환 (= backgroundImage속성…
DOM_Style JS - backgroundPosition 속성 - 배경이미지위치 설정/반환
DOM_Style JS - backgroundRepeat 속성 - 배경이미지반복 설정/반환
DOM_Style JS - backgroundClip 속성 - 배경 영역 (= backgroundClip속성 = 백그라운드클립…
DOM_Style JS - backgroundOrigin 속성 - 배경이미지 좌표시작점 설정/반환 (= 백그라운드오리진 속성)
DOM_Style JS - backgroundSize 속성 ★ - 배경이미지크기 설정/반환 (IE9 이상)
DOM_Style JS - backfaceVisibility 속성 - 3D요소 뒷면노출 설정/반환 (IE10 이상)
DOM_Style JS - border 속성 ★ - 테두리스타일 설정/반환 (= 보더속성 = border속성)
DOM_Style JS - borderBottom 속성 - 테두리하단 (= border-bottom속성 = 하단테두리 = 보더…
DOM_Style JS - borderBottomColor 속성 - 테두리하단색깔 (= 보더바텀컬러속성 = border-bot…
DOM_Style JS - borderBottomLeftRadius 속성 - 테두리하단왼쪽모서리둥글게 (= 테두리 하단좌측둥글…
DOM_Style JS - borderBottomRightRadius 속성 - 테두리하단오른쪽모서리둥글게 설정/반환 (= 테두…
DOM_Style JS - borderBottomStyle 속성 - 테두리하단스타일
DOM_Style JS - borderBottomWidth 속성 - 테두리하단두께 (= 하단테두리두께 = 보더바텀위드스 = b…
DOM_Style JS - borderCollapse 속성 - 테두리겹침설정 (= 테두리중첩설정 = 테두리이중방지 = 보더컬랩…
DOM_Style JS - borderColor 속성 - 테두리색깔 설정/반환 (= borderColor속성 = 보더컬러 속성…
43/67
목록
찾아주셔서 감사합니다. Since 2012