Sé que hay muchos ejemplos, guias etc sobre como seleccionar o deseleccionar checkbox en una página web con javascript, pero pocos hacen referencia a hacer una función un poco más generica donde abarque tanto el nombre del formulario, el nombre de elementos a seleccionar y la casilla «todos» también con checkbox.

Tenemos 2 funciones javascript, una que se encarga de seleccionar todos los «checkbox» y la otra función que se encarga de verificar si permanece seleccionado nuestro checkbox que selecciona «todos»:

function checkElements(form, elementAll, elementToCheck) {
    var form, checkbox = form.elements[elementToCheck];
    totalElements = checkbox.length;
    checkboxAll = form.elements[elementAll];

    for(var n=0; n<totalElements; n++) {
        checkbox[n].checked = checkboxAll.checked;
    }
}

function checkElementAll(form, elementAll, elementCheck) {
    var form, counter=0;
    checkbox = form.elements[elementCheck];
    checkboxAll = form.elements[elementAll];
    totalElements = checkbox.length;

    for(var n=0; n<totalElements; n++) {
        if (checkbox[n].checked == true) counter++;
    }
    if (totalElements > counter)
        checkboxAll.checked = false;
    else
        checkboxAll.checked = true;
}

Y un ejemplo de formulario sería algo como lo siguiente:

<form name="nombreFormulario" method="post" action="">
    <p><input type="checkbox" name="selecciona_todos" onclick="checkElements(this.form, this.name, 'frutas[]')" /><label>Todos</label></p>
    <p><input type="checkbox" name="frutas[]" value="manzana" onclick="checkElementAll(this.form, 'selecciona_todos', this.name)" /><label>Manzana</label></p>
    <p><input type="checkbox" name="frutas[]" value="mango" onclick="checkElementAll(this.form, 'selecciona_todos', this.name)" /><label>Mango</label></p>
    <p><input type="checkbox" name="frutas[]" value="pera" onclick="checkElementAll(this.form, 'selecciona_todos', this.name)" /><label>Pera</label></p>
    <p><input type="checkbox" name="frutas[]" value="sandia" onclick="checkElementAll(this.form, 'selecciona_todos', this.name)" /><label>Sandia</label></p>
    <p><input type="checkbox" name="frutas[]" value="naranja" onclick="checkElementAll(this.form, 'selecciona_todos', this.name)" /><label>Naranja</label></p>
</form>

🙂