이벤트객체

WeWorship TV·2020년 9월 27일
0

target.addEventListener(type, listener[, options]);
이걸 쓰면 현재 클릭한 값이 나오는데 어떻게 쓰는지 자세히 알아올것.

let menus = document.querySelectorAll("button"); //모든 버튼을 가져옵니다.

let btnAmericano = menus[0];
let btnCaffelatte = menus[1];

btnAmericano.onclick = handleClick;
btnCaffelatte.onclick = handleClick;
// 이상으로 for 문으로 충분히 구현할 수 있는 내용입니다.

function handleClick() {
  let currentMenu = event.target.textContent; // TODO
  console.log(currentMenu + "를 클릭하셨습니다.");
}

onclick과 addEventListener의 차이점

onclick : 마지막 하나만 실행되면 옛날 방식
addEventListener: 하나하나 차례대로 다 실행되고 최근 더 많이 사용됨

profile
자 이제 시작이야 내 꿈을

0개의 댓글

관련 채용 정보