<div class="hello">
<h1>Click me!</h1>
</div>
const h1 = document.querySelector('div.hello:first-child h1');
function handleTitleClick(){
const currentColor = h1.style.color;
let newColor;
//현재 h1.style.color가 blue일 경우
if (currentColor === 'blue') {
//newColor 변수에 tomato 값 담기
newColor = 'tomato';
} else {
//newColor 변수에 blue 값 담기
newColor = 'blue';
}
//조건문 통과하면서 newColor에 blue or tomato 값이 담김
//h1.style.color에 담긴 값(newColor) 넣기
h1.style.color = newColor;
}
h1.addEventListener('click', handleTitleClick);
This Pen doesn't use any external CSS resources.
This Pen doesn't use any external JavaScript resources.