이벤트 핸들러 등록
HTML의 속성이나 DOM 프로퍼티를 활용해 이벤트를 등록하는 방법 외에 `Element.addElementListener('type', 'handler')`를 통해서 이벤트 핸들러를 등록 가능하다.
// HTML 속성 사용 예시
<button onclick="alert('Button clicked!')">Click</button>
// DOM 프로퍼티 사용 예시
<button id="myBtn">Click</button>
<script>
var btn = document.getElementById('myBtn');
btn.onclick = function() {
alert('Button clicked!');
};
</script>
이벤트 핸들러 삭제
`addEventListener` 메소드를 활용하여 이벤트 핸들러를 등록했다면, `Element.removeEventListener('type', 'handler')`를 통해서 이벤트 핸들러 삭제 가능하다.
브라우저 기본 동작
브라우저 기본 동작인 마우스 오른쪽을 클릭하면 상황에 맞는 메뉴 창이 뜨거나, `input`태그에 커서를 두고 키보드 키를 누르면 해당 값이 입력되는 것을 `preventDefault` 메소드로 막을 수 있다.
하지만 HTML 태그들이 가지고 있는 고유한 역할과 의미를 훼손하게 될 수 있기 때문에 사용에 주의해야 한다.
이 글은 내용을 축소하여 정리한 것으로 일부 정보가 누락되었을 수 있음.
'Front-End > JavaScript' 카테고리의 다른 글
[JavaScript] 옵셔널 체이닝 (Optional Chaining) (0) | 2024.09.12 |
---|---|
[JavaScript] 콜백 함수(Callback) 정리 (0) | 2024.09.11 |
[JavaScript] Rest Parameter, Arrow Function, this 정리 (2) | 2024.09.11 |
[JavaScript] AND, OR 연산자 정리 (Feat. null 병합 연산자) (0) | 2024.09.10 |
[JavaScript] DOM트리와 요소 다루기 (0) | 2024.09.09 |