- 01. 이벤트 메서드 : addEventListener("click") : 클릭했을 때
- 01. 이벤트 메서드 : addEventListener("dblclick") : 더블클릭했을 때
- 01. 이벤트 메서드 : addEventListener("load") : 문서 로딩이 끝났을 때
- 01. 이벤트 메서드 : addEventListener("error") : 문서가 정확히 로딩되지 않았을 때
- 01. 이벤트 메서드 : addEventListener("scroll") : 스크롤했을 때
- 01. 이벤트 메서드 : addEventListener("resize") : 브라우저 사이즈가 변경 됐을 떄
- 01. 이벤트 메서드 : addEventListener("selectstart") : 텍스트 선택을 시작했을때
- 01. 이벤트 메서드 : addEventListener("mousedown") : 마우스 버튼을 클릭했을때
- 01. 이벤트 메서드 : addEventListener("mouseup") : 마우스 버튼을 떼는 경우
- 01. 이벤트 메서드 : addEventListener("mousemove") : 마우스를 움직이는 경우
- 01. 이벤트 메서드 : addEventListener("mousesenter") : 요소 위에 포인터 요소 위치가 있을때
- 01. 이벤트 메서드 : addEventListener("mouseleave") : 요소 위에 포인터 요소 위치가 벗어 났을때
- 01. 이벤트 메서드 : addEventListener("mouseover") : 요소 밖에 포인터 요소 위치가 있을때
- 01. 이벤트 메서드 : addEventListener("mouseout") : 요소 위에 포인터 요소 위치가 벗어 났을때
- 01. 이벤트 메서드 : addEventListener("blur") : 폼 요소에 포커스를 잃었을 떄
- 01. 이벤트 메서드 : addEventListener("change") : 목록이나 체크 상태 등이 변경되었을 때
- 01. 이벤트 메서드 : addEventListener("focus") : 폼 요소에 포커스를 놓았을 때
- 01. 이벤트 메서드 : addEventListener("reset") : 폼이 리셋되었을 때
- 01. 이벤트 메서드 : addEventListener("submit") : 폼에 있는 버튼을 클릭했을 때
- 01. 이벤트 메서드 : addEventListener("drag") : 드래그 중인 경우
- 01. 이벤트 메서드 : addEventListener("dragstart") : 드래그를 시작했을 떄
- 01. 이벤트 메서드 : addEventListener("dragend") : 드래그 끝났을때
- 01. 이벤트 메서드 : addEventListener("dragenter") : 요소의 위치에 드래그 했을때
- 01. 이벤트 메서드 : addEventListener("dragover") : 요소의 위치 위에 있을때
- 01. 이벤트 메서드 : addEventListener("dragleave") : 요소의 위치 위에서 벗어 났을 떄
- 01. 이벤트 메서드 : addEventListener("drop") : 요소의 위치에 드롭했을때
- 01. 이벤트 메서드 : addEventListener("keydown") : 키 눌렀을 때 (한번만 실행)
- 01. 이벤트 메서드 : addEventListener("keypress") : 키 눌렀을 때 (누르고 있으면 계속 실행)
- 01. 이벤트 메서드 : addEventListener("keyup") : 키누르고 뗏을때
- 01. 이벤트 메서드 : addEventListener("touchstart") : 터치가 시작 됐을 때
- 01. 이벤트 메서드 : addEventListener("touchmove") :터치가 움직이고 있을때
- 01. 이벤트 메서드 : addEventListener("touchend") : 터치가 끝났을 때
- 01. 이벤트 속성 : clientX : X축 좌표값 : 브라우저 기준
- 01. 이벤트 속성 : clientY : Y축 좌표값 : 브라우저 기준/a>
- 01. 이벤트 속성 : offsetX : X축 좌표값 : 요소 기준
- 01. 이벤트 속성 : offsetY : Y축 좌표값 : 요소 기준
- 01. 이벤트 속성 : pageX : X축 좌표값 : 페이지 기준
- 01. 이벤트 속성 : pageY : Y축 좌표값 : 페이지 기준
- 01. 이벤트 속성 : screenX : X축 좌표값 : 디바이스 기준
- 01. 이벤트 속성 : screenY : Y축 좌표값 : 디바이스 기준
- 01. 요소 속성 : 크기 및 위치 : element.clientWidth : 요소의 가로값(마진/보더 미포함)
- 01. 요소 속성 : 크기 및 위치 : element.clientHight : 요소의 세로값(마진/보더 미포함)
- 01. 요소 속성 : 크기 및 위치 : element.clientTop : 요소의 Y축 값(부모 기준)
- 01. 요소 속성 : 크기 및 위치 : element.clientLeft : 요소의 X축 값(부모 기준)
- 01. 요소 속성 : 크기 및 위치 : element.offsetWidth : 요소의 가로값(보더/패딩 포함)
- 01. 요소 속성 : 크기 및 위치 : element.offsetHeight : 요소의 세로값(보더/패딩 포함)
- 01. 요소 속성 : 크기 및 위치 : element.offsetTop : 요소의 Y축 값(문서 기준)
- 01. 요소 속성 : 크기 및 위치 : element.offsetLeft : 요소의 X축 값(문서 기준)
- 01. 요소 메서드 : 크기 및 위치 : element.getBoundingClinetRect() : 요소의 크기 및 위치 값을 설정