addEventListener : 이벤트 등록 함수
기본 문법
const title = document.querySelector("h1");
title.addEventListener("이벤트종류", 함수이름)
예시
window.onload = () =>{
//사원 전체 보기를 누르면 분홍색 div만 보이게, 사원 등록하기를 누르면 초록색 div만 보이게
const pink = document.getElementById("pink");
const green = document.getElementById("green");
const total = document.getElementById("total");
const enroll = document.getElementById("enroll");
total.addEventListener('click',()=>{
pink.style.display = 'block';
green.style.display = 'none';
})
enroll.addEventListener('click',()=>{
green.style.display = 'block';
pink.style.display = 'none';
})
}
마우스 올리면 색깔 변경(레드/블루)
window.onload = () =>{
const pink = document.getElementById("pink");
const green = document.getElementById("green");pink.addEventListener('mouseenter', ()=>{
pink.style.backgroundColor = 'red'; //마우스를 갖다 댔을 때 핑크가
})
green.addEventListener('mouseenter', ()=>{
green.style.backgroundColor = "blue";
})