<body>
<h1 id="main-title"> Study </h1>
<button class="btn"> 클릭!! </button>
<script>
var btn = document.querySelector('.btn');
var mainTitle = document.querySelector('.main-title');
function btnClickHandler(){
mainTitle.style.background = 'red';
}
btn.addEventListener('click',btnClickHandler);
</script>버튼을 누르면 h1태그 제목의 색이 바뀌게 하기 위해서
각각 button 과 h1 태그의 선택자를 선택해 변수에 넣는다.
h1에 스타일을 주는 function을 만든다.
addEventListener('click',스타일을 주는 함수)
를 이용해서 button을 눌렀을 때 이벤트가 생성되도록 만든다.
btn.onclick =
btn.addEventListener()
둘중에서 밑에있는 것을 많이 사용(여러개를 적용시킬 수 있기 때문에)
btn.onclick은 여러개를 적용시킬 경우 앞에 있던설정들이 최근설정에 덮혀진다.
안녕하세요.