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="8" 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
var math_it_up = {
'+': function (x, y) { return x + y },
'-': function (x, y) { return x - y },
'*': function (x, y) { return x * y },
'/': function (x, y) { return x / y }
};
$('input').each(function(){
if($(this).attr('data-equation')!=undefined){
var equation=$(this).attr('data-equation');
$(this).val(calculate(equation));
}
});
function calculate(equation){
result=0;
index=2;
var value1 = $('input[data-column="'+equation.substring(0,1)+'"][data-row="'+equation.substring(1,2)+'"]').val();
result = parseInt(value1);
while(equation.substring(index,index+1) !== "") {
var operator = equation.substring(index, index+1);
var value = $('input[data-column="'+equation.substring(index + 1, index+2)+'"][data-row="'+equation.substring(index + 2, index+3)+'"]').val();
result = math_it_up[operator](result, parseInt(value));
index += 3;
}
return result;
}