강의/노마드 코더 강의

노마드 코더 - 바닐라 JS로 크롬 앱 만들기 - addEventListener

홍시_코딩기록 2023. 5. 26. 20:36

 

왼) mouseenter, 오)mouseleave
 
 
const title = document.querySelector(".hello:first-child h1");

function titleClick() {
    title.style.color = 'blue';
}
function titleMouseEnter() {
    title.innerHTML = "mouse is here@!"
}

function titleMouseLeave() {
    title.innerHTML = "mouse is gone!"
}

title.addEventListener("click", titleClick);
title.addEventListener("mouseenter", titleMouseEnter);
title.addEventListener("mouseleave", titleMouseLeave);

축약해서 쓰는 방법이 있을 것 같아서 찾아봤는데

const title = document.querySelector(".hello:first-child h1");

title.addEventListener("click", () => {
  title.style.color = 'blue';
});

title.addEventListener("mouseenter", () => {
  title.innerHTML = "mouse is here@!";
});

title.addEventListener("mouseleave", () => {
  title.innerHTML = "mouse is gone!";
});

이렇게 줄여쓰면 될것같다