#TIL38

전혜린·2021년 10월 20일
0

Today I Learned

목록 보기
56/64

UI 이벤트

  • load
    페이지를 완전히 불러왔을 때 window에서, 모든 프레임을 완전히 불러왔을 때 프레임셋에서, 이미지나 객체를 완전히 불러왔을때 <img> 요소나 <object> 요소에서 발생
  • unload
    페이지를 완전히 종료했을 때 window에서, 모든 프레임을 완전히 종료했을 때 프레임셋에서, 객체를 완전히 종료했을 때 <object> 요소에서 발생
  • abort
    <object> 요소의 콘텐츠를 완전히 내려받기 전에 사용자가 취소했을 때 해당 요소에서 발생
  • error
    자바스크립트 에러가 발생했을 때 window에서, 이미지를 불러올 수 없을 때 해당 <img> 요소에서, <object> 요소 콘텐츠를 불러올 수 없을 때 해당 요소에서, 프레임을 불러올 수 없을 때 해당 프레임셋에서 발생
  • select
    사용자가 텍스트 박스 <input>이나 <textarea>에서 글자를 선택할 때 발생
  • resize
    window 나 프레임의 크기를 바꿀 때 발생
  • scroll
    사용자가 스크롤바 있는 요소를 스크롤할 때 발생. <body> 요소에는 페이지 전체에 대한 스크롤바가 있음

Focus 이벤트

  • blur
    요소가 포커스를 잃을 때 발생. 이 이벤트는 버블링 되지 않음(모든 브라우저 지원)
  • focus
    요소가 포커스를 받을 때 발생. 이 이벤트는 버블링 되지 않음(모든 브라우저 지원)
  • focusin
    요소가 포커스를 받을 때 발생. HTML 이벤트 focus의 버블링 버전
  • focusout
    요소가 포커스를 잃을 때 발생. HTML 이벤트 blur의 버블링 버전

Mouse/Wheel 이벤트

  • click
    사용자가 주요 마우스 버튼 일반적으로 왼쪽 버튼을 클릭하거나 엔터키를 누를때 발생. 키보드와 마우스에 모두 반응하므로 접근성 구현에 중요(mousedown -> mouseup -> click)
  • dbclick
    사용자가 주요 마우스 버튼(일반적으로 왼쪽 버튼)을 더블 클릭할 때 발생.(DOM 레벨 3 이벤트에서 표준화)
  • mousedown
    사용자가 마우스 버튼을 누를 때 발생
  • mouseenter
    마우스 커서가 요소 밖에서 요소 경계 안으로 처음 이동할 때 발생. 이 이벤트는 버블링되지 않으며 커서가 자손 요소 위에 올라갈 때 발생하지도 않음.(DOM 레벨 3 이벤트에서 추가)
  • mouseleave
    마우스 커서가 요소 위에 있다가 요소 경계 밖으로 이동할 때 발생. 버블링되지 않으며 커서가 자손 요소 위에 올라갈 때 발생하지도 않음.(DOM 레벨 3 이벤트에서 추가)
  • mousemove
    마우스 커서가 요소 위를 이동하는 동안 계속 발생
  • mouseout
    마우스 커서가 요소 위에 있다가 다른 요소(경계 밖의 요소 혹은 자식 요소) 위로 이동할 때 발생
  • mouseover
    마우스 커서가 요소 바깥에 있다가 요소 경계 안으로 이동할 때 발생
  • mouseup
    사용자가 마우스 버튼을 누르고 있다가 놓을 때 발생
  • mousewheel(DOMMouseScroll)
    사용자가 마우스 휠을 세로 방향으로 움직일 때 발생

키보드/텍스트 이벤트

  • keydown
    사용자가 키를 처음 누를 때 발생하며 누르고 있는 동안 계속 발생
  • keypress
    사용자가 키를 누른 결과로 문자가 입력되었을 때 처음 발생하며 누르고 있는 동안 계속 발생. ESC 키에서도 발생. (DOM 레벨3 에서는 keypress 이벤트를 폐기 했으며 , textInput 이벤트를 권장)
  • keyup
    사용자가 키에서 손을 뗄 때 발생
  • textInput
    텍스트가 텍스트 박스에 삽입되기 직전에 발생(문자 입력전에 이벤트를 가로챌 수 있음)

터치와 제스처 이벤트

  • touchstart
    손가락으로 화면을 터치할 때 발생. 이미 다른 손가락을 화면에 대고 있어도 다른 손가락을 대면 또 발생
  • touchmove
    손가락을 화면에서 움직일 때 계속 발생
    이 이벤트가 일어나는 동안 preventDefault()를 호출하면 스크롤을 막을 수 있음
  • touchend
    손가락을 화면에서 뗄 때 발생
  • touchcancel
    시스템에서 터치를 더 이상 추적하지 않을 때 발생(명확하게 문서화되지는 않음)
  • gesturestart
    한 손가락을 화면에 얹은 채 다른 손가락으로 화면을 터치할 때 발생
  • gesturechange
    화면에서 두 손가락 중 하나의 위치가 바뀔 때 발생
  • gestureend
    두 손가락 중 하나를 화면에서 뗄 때 발생
profile
코딩쪼아

0개의 댓글