자바스크립트 이벤트리스너(eventListener)의 기본구조는 어떻게 될까?

 

자바스크립트 이벤트리스너의 기존구조

 

 

 

안녕하세요~

 

 

자바스크립트의 이벤트리스너의 기본 구조에 대하여 알아 보겠습니다 !

document.getElementById("names").addEventListener("click", function(){
  // 이 안에 function에 대한 내용을 작성함
})

 

위의 이벤트리스너 기본구조를 풀어서 설명 하였습니다.

자바스크립트 이벤트리스너 (javascript EventListener)

 

아래는 마우스 클릭시 이벤트 리스너를 통해 해당 names를 보여주지 않는 방법입니다. 

document.getElementById("names").addEventListener("click", function(){ // click을 하였을때
    document.getElementById("alert").style.display = 'none'; // style을 none 처리함(안보여줌)
})

 

 

아래 사이트에서 이벤트리스너에 대한 설명을 추가로 확인하실수 있으니 참고 부탁드립니다~!

https://developer.mozilla.org/ko/docs/Web/API/EventTarget/addEventListener

EventTarget.addEventListener() - Web API | MDN

 

 

감사합니다