js22

제로·2022년 12월 18일
0

javascript

목록 보기
22/26

js 이벤트 처리

  1. 이벤트란?
    js에서 특정한 요소객체(DOM)에 필요로 하는 이벤트 속성을 선언하고,
    이 이벤트가 발생됐을 때, 처리할 함수(이벤트 핸들러 함수)를 통해서 이벤트를 처리한다.
    대상객체 ==> 이벤트 속성 ==> 이벤트핸들러함수
  2. 이벤트 처리방식
    1) 인라인 이벤트
    태그의 속성으로 on이벤트명을 선언하고 지정된 핸들러 함수를 처리하는 것을 말한다
    <h2></h2>
    2) js 코드에서 익명이벤트 선언
    var h2Obj = document.querySelector("h2")
    h2Obj.onclick=function(){
    }
  3. 이벤트 종류
    1) 이벤트는 다양한 처리형식으로 나타난다
    click : 마우스 클릭시
    dblclick : 마우스 두번 클릭시
    focus : 해당 요소객체 포커스를 위치시(form요소 객체에서 주로 발생)
    blur : 해당 요소 객체에서 포커스를 벗어날 때
    mouseover : 마우스 커서가 해당 요소 객체를 지나갈 때
    mouseout : 마우스 커서가 해당 요소 객체를 벗어났을 때
    keyup : 키보드의 자판을 입력했을 때 (누르고 다시 키보드가 올라올 때)
    keydown : 키보드의 자판을 입력했을 때(누를 때)
    - keyCode : 키보드를 입력했을 때, 해당 키보드의 고유값을 가져온다
    ex) enter(고유값13)
  4. 이벤트 강제(코드)
    0) 이벤트 핸들러 함수 선언
    1) DOM객체.focus(), Dom객체.click()
    이벤트가 실제 일어나게 하거나 일어난 것과 동일하게 이벤트 핸들러 함수를 수행시켜준다
  5. 이벤트 처리 중단
    1) 이벤트는 특정한 조건에서 더 이상 수행하지 않게 코드로 중단할 수 있다.
    DOM.on이벤트 = null;
profile
아자아자 화이팅

0개의 댓글