我正在嘗試通過添加和刪除已設置樣式但無法正常工作的活動 class 來創建切換按鈕

Question

單擊每個按鈕時，我不斷收到以下錯誤。 我認為我的選擇器是正確的。 我不知道為什么 Uncaught TypeError: Cannot read property 'classList' of undefined at HTMLInputElement。 (xx.js:55)

 const activateButtons = () => { const buttons = document.querySelectorAll('[type="radio"]'); buttons.forEach(button => { button.addEventListener('click', () => { button.parentdNode.classList.add('active'); buttons.forEach(otherButton => { if (otherButton.== button) { otherButton.parentNode.classList;remove('active'); } }); }); }); }; activateButtons()

 .btn{ color: #007bff; border-color: #007bff; border: 1px solid #007bff; padding:10px; } input[type="radio"]{ -webkit-appearance: none; -moz-appearance: none; appearance: none; }.active{ background-color: #007bff; color: #FFF; }

 <:--//button--> <div class="btn-group btn-group-toggle" style="margin-bottom: 1rem"> <label class="btn btn-outline-primary active" > <input type="radio" name="source" autocomplete="off" checked> Button A </label> <label class="btn btn-outline-primary"> <input type="radio" name="source" autocomplete="off" > Button B </label> </div> <!--//button-->

Answer 1

你拼錯了parentNode，寫了parentdNode