오늘은 튜터님과의 면담이 있었다...
그리고 한번에 하나의 버튼만 선택되는 코드가.. 상당히 어려운거같다. 튜터님이 좀 알려주셨는데.. 사실 지금도 잘 모르겠다. 아예 JS의 기초가 안된 거 같다.
일단 튜터님께서 hover로 하나하나 입력하는건 우선순위가 있어서 서로 작 먹혀들어가버린다고 하셨다.
그리고 그렇게 작업하면 큰 페이지는 절대 못만든다고 그렇게 하지 말라고 하셨다.
튜터님께서 알려주신 코드는
<script>
function activate(name) {
document.querySelector(name).classList.toggle('active(가져오고자 하는 css의 클라스)')
}
</script>
<body>
<button type="button" class="btnAll tag" id="btnAll" onClick="activate('.btnAll')" aria-pressed="true">ALL
</button>
<button class="btnMmorpg tag " onClick="activate('.btnMmorpg')">MMORPG
</button>
<button class="btnShooter tag" onClick="activate('.btnShooter')">Shooter
</button>
<button class="btnBattleroyale tag" onClick="activate('.btnBattleroyale')">Battle
Royale
</button>
</body>
이것인데 문제는 이제 버튼 하나를 클릭하면 나머지 버튼이 전부 해제되는 것이 구현되지 않는다... 팁을 알려주셨는데 다 해봤는데도 모르겠다. 엉뚱한 데서 해메고 있다는 생각이 든다. 내일 아침에 일어나서 또 시도해봐야겠다.