Development(7985)
-
기본 이벤트(default event), 기본 이벤트 제거
기본 이벤트(default event) 일부 HTML 태그는 이미 이벤트 핸들러를 가지고 있는데 이벤트가 발생할 때 이벤트 연결 없이 사용할 수 있는 이벤트가 있는데 이벤트를 기본 이벤트라고 합니다. 기본 이벤트 제거 · 기본 이벤트가 있는 HTML 태그에 이벤트 연결을 하면 이벤트 연결에 의해 새롭게 호출되는 이벤트 핸들러와 기본 이벤트에 의해 고유의 이벤트 핸들러가 함께 호출되기 때문에 원하는 형태의 이벤트 처리가 어려워집니다. 따라서 기본 이벤트를 제거함으로써 원하는 이벤트 연결이 가능하게 처리해야 합니다. · HTML 요소에 클릭(click) 이벤트가 발생하면 브라우저는 지정된 주소로된 새로운 웹 페이지를 열게 됩니다. 이렇게 특정 이벤트는 미리 지정된 기본 동작을 가지고 있습니다. · 하지만 p..
-
이벤트 전달(이벤트 전파; event propagation), 이벤트의 전파 방식 - 이벤트 버블링 (bubbling), 이벤트 캡쳐링 (capturing), 이벤트 전달 막기
이벤트 전달(이벤트 전파; event propagation)특정 이벤트가 먼저 발생해 어떤 순서로 발생할지 정하는 것을 이벤트 전달이라고 합니다. 즉, 이벤트가 발생했을 때, 브라우저가 이벤트 리스너를 실행시킬 대상 요소를 결정하는 과정을 의미합니다.이벤트의 대상이 Window 객체와 같은 단일 객체라면 이벤트의 전파는 일어나지 않습니다. 하지만 Document 객체나 HTML 문서의 요소에서 이벤트가 일어나면 대상 요소를 결정하기 위해 이벤트의 전파가 일어납니다. 이벤트의 전파 방식이벤트의 전파 방식은 크게 이벤트 버블링과 이벤트 캡처링 두 가지 방식으로 구분됩니다.일반적으로 자바스크립트의 이벤트 전달 순서는 이벤트 버블링 방식으로 일어납니다.
-
이벤트 객체(event object)
이벤트 객체(event object)· 특정 타입의 이벤트와 관련이 있는 객체입니다.· 이벤트 객체는 해당 타입의 이벤트에 대한 상세 정보를 저장하고 있습니다.· 이벤트 리스너가 등록되고 해당 객체나 요소에 지정된 타입의 이벤트가 발생하면, 브라우저는 자동으로 등록된 이벤트 리스너를 호출합니다. 이때 이벤트 리스너는 인수로 이벤트 객체(event object)를 전달받으며, 식별자를 통해 전달받은 이벤트 객체를 참조합니다.· 모든 이벤트 객체는 이벤트의 타입을 나타내는 type 프로퍼티와 이벤트의 대상을 나타내는 target 프로퍼티를 가집니다. 이러한 이벤트 객체는 이벤트 리스너가 호출될 때 인수로 전달됩니다.
-
객체나 요소의 메소드로 이벤트 리스너를 전달하는 방법
객체나 요소의 메소드로 이벤트 리스너를 전달하는 방법· 표준 이벤트 모델· 웹 표준을 만드는 단체인 W3C에서 공식적으로 지정한 DOM Level 2 이벤트 모델입니다.· 객체나 요소의 메소드로 이벤트 리스너를 전달하는 방법입니다. · 이벤트 리스너를 프로퍼티로 등록할 때는 "on"이 붙은 이벤트 타입을 사용하지만, addEventListener() 메소드에서는 "on"이 붙지 않은 이벤트 타입을 사용해야 합니다. 객체나 요소의 메소드로 이벤트 리스너를 전달할 때는 다음의 메소드를 사용할 수 있습니다.
-
객체나 요소에 프로퍼티로 등록하는 방법 - 자바스크립트 코드에서 프로퍼티로 등록하는 방법, HTML 태그에 속성으로 등록하는 방법
객체나 요소에 프로퍼티로 등록하는 방법객체나 요소에 프로퍼티로 이벤트 리스너를 등록할 때는 다음과 같은 방법을 사용할 수 있습니다. · 자바스크립트 코드에서 프로퍼티로 등록하는 방법· HTML 태그에 속성으로 등록하는 방법 자바스크립트 코드에서 프로퍼티로 등록· 이벤트의 대상이 되는 객체나 요소에 자바스크립트 코드에서 프로퍼티로 등록하는 방법은 거의 모든 브라우저가 대부분의 이벤트 타입을 지원하고 있습니다.· 이 방법은 이벤트 타입별로 오직 하나의 이벤트 리스너만을 등록할 수 있습니다. HTML 태그에 속성으로 등록· HTML 태그의 속성에 이벤트를 처리하는 방식으로 인라인 이벤트 처리방식이라고도 합니다.· 이 방법은 HTML 코드에 자바스크립트 코드가 추가됨으로써 가독성이 안 좋아지며, 유지보수도 힘들..
-
이벤트 유형(event type), 이벤트 속성
이벤트 유형(event type)· 이벤트 유형(event type)은 발생한 이벤트의 종류를 나타내는 문자열을 의미합니다.· 다른 말로 이벤트 타입(event type), 이벤트 명(event name)이라고도 합니다.· 키보드, 마우스, HTML DOM, Window 객체 , HTML 프레임, HTML 입력 양식 등의 이벤트가 있습니다. 이벤트 속성이벤트가 발생했을 때 이벤트 발생으로 호출되어야 할 이벤트 핸들러(실행 함수)를 연결하는 역할을 합니다.