Tengo 3 casillas de verificación y un botón, así que cuando hago clic en este botón, todo debe estar marcado y si vuelvo a hacer clic, todo debe desmarcarse, pero no funciona. Quiero todas las funciones dentro de mi objeto de esta manera.
btn: null, check: function(checked = true) { const checkboxes = document.querySelectorAll('input[name="cb"]'); checkboxes.forEach((checkbox) => { checkbox.checked = checked; }); }, checkAll: function() { this.check(); this.onclick = uncheckAll; }, uncheckAll: function() { this.check(false); this.onclick = checkAll; }, } btn.check(); <body style="background-color: #0d1117; color: #6D859E"> <div style="margin: 60px;"> <button id="btn">Check / Uncheck All</button> <ul style="list-style-type: none; padding: 0"> <li> <label for="c1"><input type="checkbox" name="cb" value="1" id="c1">1</label> </li> <li> <label for="c2"><input type="checkbox" name="cb" value="2" id="c2">2</label> </li> <li> <label for="c3"> <input type="checkbox" name="cb" value="3" id="c3">3</label> </li> </ul> </div> </body>