JavaScript : DOM의 키보드 이벤트에 대해서

키보드 이벤트 

사용자가 키보드를 누르거나 뗄 데 발생하는 이벤트다. 

• keydown
  키보드의 키를 누를 때 발생하는 이벤트로 키를 계속 누르고 있으면 이벤트가 반복적으로 발생한다.
  
  
• keyup
  키보드의 키를 뗄 때 발생하는 이벤트다.
  
  
• keypress
  키보드의 키를 누르고 있을 때 발생하는 이벤트다. Shift, Ctrl, Alt, Meta와 같은 특수키는 이벤트가 발생하지 않는다.

 

키보드 이벤트의 속성

속성	설명
type	이벤트의 종류
target	이벤트가 발생한 요소
key	이벤트가 발생한 키의 값
code	이벤트가 발생한 키의 물리적인 위치
keyCode	이벤트가 발생한 키의 숫자 코드
altKey	이벤트가 발생할 때 Alt 키가 눌려있는지 여부
ctrlKey	이벤트가 발생할 때 Ctrl 키가 눌려있는지 여부
shiftKey	이벤트가 발생할 때 Shift 키가 눌려있는지 여부
metaKey	이벤트가 발생할 때 Meta 키가 눌려있는지 여부

 

아래 예제는 키보드 키를 누를 때, 각각의 키보드 이벤트 속성에 대해 작성해 놓았다. 키보드를 누르면 이벤트가 시행된다.

See the Pen keyboardevent by coding-ji (@coding-ji) on CodePen.