"> JS 이벤트에서도 선택자가 중요함 "> JS 이벤트에서도 선택자가 중요함 ">

image.png

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>JS 이벤트에서도 선택자가 중요함</title>
</head>
<body>

<button onclick="test()">아이디,클래스 선택자</button>

<ul>
	<li>리스트01</li>
	<li id="apple">리스트02</li>
	<li class="banana">리스트03</li>
	<li class="banana">리스트04</li>
	<li>리스트05</li>
</ul>

<script type="text/javascript">
	function test(){
		var elem = document.getElementById('apple');
		elem.style.backgroundColor = 'lightblue';
		
		var elems = document.getElementsByClassName('banana');
		// var elems = document.querySelectorAll('.banana');
		for(var i=0 ; i<elems.length ; i++){
			elems[i].style.backgroundColor = 'lightpink';
		}
	}
</script>

</body>
</html>