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

[DOM_Event] JS - unload 이벤트 (= onunload 속성) - 사용자가 웹문서 닫을때 JS실행 (= 언로드 이벤트 = 온언로드 속성) ※ 페이지 이탈 시 실행

목차
  1. unload 예제 - 사용자가 페이지 이탈
  2. unload 정의
  3. unload 구문

 

unload 예제 - 사용자가 페이지 이탈 

 

<html>

<head>

<script>

var a = '어서와. 홈짱닷컴은 처음이지?';

var b = '가는거야? 다음에 또 올거지?';

function welcome() {

    alert(a);

}

function goodbye() {

    alert(b);

}

</script>

</head>

<body  onload="welcome()" onunload="goodbye()">

홈짱닷컴 (Homzzang.com)

</body>

</html>

 

결과 보기

※ 브라우저에 따라 작동 안 할 수 있음. (크롬 작동 X)

 

unload 정의


페이지가 언로드되거나 브라우저 창을 닫으면 발생.

 



1.

사용자가 페이지를 탐색 할 때 발생 

(링크를 클릭하거나 양식을 제출하거나 브라우저 창을 닫음 등).


2.

사용자가 페이지 (및 onload 이벤트) 다시로드할 때도 발생.

3.
브라우저에 따라 작동 안 할 수 있음.


4.
지원 HTML 태그: <body>

 

 

unload 구문

 

HTML 속성 방식

<element onunload="JS실행코드">


JS 속성 방식

object.onunload = function(){실행코드};

JS 메서드 방식
object.addEventListener("unload", 실행코드);

 

※ addEventListener () 메서드는 IE8 이전 버전에서는 지원 안 함. 

※ HTML element(요소)에는 주로 body 옴.

※ JS object(객체)에는 주로 window 옴.



분류 제목
DOM_Style JS - columnSpan -
DOM_Style JS - columnWidth -
DOM_Style JS - content -
DOM_Style JS - counterIncrement -
DOM_Style JS - counterReset -
DOM_Style JS - cursor -
DOM_Style JS - direction 속성 - 텍스트방향 (= 텍스트진행방향 = direction속성 = 디렉션 속성)
DOM_Style JS - display 속성 ★ - 요소 표시 방법 설정/반환 (= display속성 = 디스플레이속성) 상…
DOM_Style JS - emptyCells -
DOM_Style JS - filter 속성 - 이미지필터효과 (= filter속성 = 필터속성) ※ 흑백이미지만들기
DOM_Style JS - flex -
DOM_Style JS - flexBasis -
DOM_Style JS - flexDirection -
DOM_Style JS - flexFlow -
DOM_Style JS - flexGrow 속성 - 동일컨테이너 안 나머지 플렉스아이템에 비해 얼마나 커질지 지정 (= 플렉스…
DOM_Style JS - flexShrink 속성 - 동일컨테이너 안 나머지 플렉스아이템에 비해 얼마나 줄어들지 지정 (= …
DOM_Style JS - flexWrap -
DOM_Style JS - cssFloat 속성 - ★ - 요소나란히 (= 요소한줄로 = 요소가로로 = 요소옆으로정렬 = 플로…
DOM_Style JS - font 속성 ★ - 글자스타일종합 (= font속성 = 글씨체 = 서체 = 글꼴 = 폰트속성, 상…
DOM_Style JS - fontFamily 속성 ★ - 폰트 종류 설정/반환. (= 글꼴 종류 = fontFamily속성 …
46/67
목록
찾아주셔서 감사합니다. Since 2012