JSFiddle - React, Tailwind, and code Playground

HTML

<table>
    <tr>
        <td><input type="text" data-column="A" value="5" data-row="1" /></td>
        <td><input type="text" data-column="B" value="2" data-row="1" /></td>
        
    </tr>
     <tr>
        <td><input type="text" value="7" data-column="A" data-row="2" /></td>
        <td><input type="text" value="9" data-column="B" data-row="2" /></td>
    </tr>
    <tr>
        <th><input type="text" data-column="A" data-row="3"  data-equation="A1+A2-B1" /></th>
        <th><input type="text" data-column="B" data-row="3"  data-equation="B1+B2"  /></th>
    </tr>
    
</table>

JavaScript

function calculate(equation){
    var vals = getValues(equation),
        operators = getOperators(equation),
        num1 = vals[0];
    for(var i=0; i<operators.length; i++){
        console.log('num1 = ' + num1);
        num1 = calculateOperation(operators[i], num1, vals[i+1]);
    }
    return num1;
}

function calculateOperation(op, num1, num2){
    console.log('equation: ' + num1+op+num2);
    if (op === '+'){
        return num1 + num2;
    } else if (op === '-'){
        return num1 - num2;
    }
}

function getValues(eq){
    var column, row,
        operatorRegex = /[\+|\-]/;
        return eq.split(operatorRegex).map(function(identifier){
            column = identifier.replace(/[0-9]+/, "");
            row = identifier.replace(/[A-Za-z]+/, "");
            return parseInt($('[data-column="'+column+'"][data-row="'+row+'"]').val(), 10);
        });
}

function getOperators(eq){
     var ops = eq.split(/[A-Za-z0-9]+/);
     // remove the quotes and return
     return ops.slice(1, ops.length-1);
}

$('input').each(function(){
    if($(this).attr('data-equation')!=undefined){
        var equation=$(this).attr('data-equation');
        $(this).val(calculate(equation))
    }
});