Al ejecutar RemoveChild restar valor al total

[Alexis88]

Tienes que volver a tomar el valor de la celda de la fila a eliminar pues lo que hiciste en la función "Calcular" fue tomar el valor de cada celda e ir reemplazándolo en cada vuelta.

En realidad, lo que buscas hacer, no es difícil.

Código HTML:

<table id = "productos">
    <thead>
        <tr>
            <th>Producto</th>
            <th>Costo</th>
            <th>Opción</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td>Manzana</td>
            <td class = "costo">12.57</td>
            <td>
                <label>Eliminar</label>
            </td>
        </tr>
        <tr>
            <td>Sandía</td>
            <td class = "costo">35.41</td>
            <td>
                <label>Eliminar</label>
            </td>
        </tr>
        <tr>
            <td>Melón</td>
            <td class = "costo">18.35</td>
            <td>
                <label>Eliminar</label>
            </td>
        </tr>
        <tr>
            <td id = "total" colspan = "3"></td>
        </tr>
    </tbody>
</table>
 

Código Javascript:

//Al cargar el documento, ejecutaremos lo siguiente
document.addEventListener("DOMContentLoaded", function(){
    var tbody = document.querySelector("#productos tbody"), //El cuerpo de la tabla
        total = tbody.querySelector("#total"), //La celda del total
        fila, //Variable a utilizar para almacenar una fila
        valor, //El valor de la celda del costo de la fila a eliminar
        suma = 0; //La variable acumuladora
    
    //Recorremos al conjunto de celdas con la clase "costo"
    [].forEach.call(tbody.querySelectorAll(".costo"), function(costo){
        //Y acumulamos sus valores
        suma += parseFloat(costo.innerHTML);
    });
    
    //Fijamos el valor del acumulado a dos decimales
    suma = suma.toFixed(2);
    
    //Mostramos el acumulado en la celda del total
    total.innerHTML = "Total: " + suma;
    
    //Recorremos al conjunto de opciones "Eliminar"
    [].forEach.call(tbody.querySelectorAll("label"), function(opcion){
        //Cuando se dé un clic en alguna de ellas, ejecutaremos una función
        opcion.addEventListener("click", function(){
            //Tomamos a la fila que contiene al botón pulsado
            fila = this.parentNode.parentNode;
            
            //Tomamos al valor de la celda del costo de esta fila
            valor = fila.querySelector(".costo").innerHTML;
            
            //Actualizamos el valor de la variable acumuladora
            suma -= parseFloat(valor);
            
            //Fijamos el valor del acumulado a dos decimales
            suma = suma.toFixed(2);
            
            //Actualizamos el valor de la celda del total
            total.innerHTML = "Total: " + suma;
            
            //Eliminamos la fila de la tabla
            tbody.removeChild(fila);
        }, false);
    });
}, false);
 

DEMO

La explicación está en los comentarios. Disculpa la extensión del ejemplo pero lo hice de esa manera para que veas el paso a paso al detalle. Si tienes alguna duda, pregúntame.

Saludos