S2JS - Javascript interacting with HTML : Handling operations

Now the important bit — handling operation keys.

Store a copy of the currently displayed number in a variable called temp, for convenience
Depending on the previous operator, apply that number to the running_result variable
If the equals button was pressed, display the running result
Otherwise reset the display
Remember which operator was pressed because it becomes the previous operator

function PressOperator (op) { var temp = Number(numdisplay.innerText); if (prev_op == "+") running_result += temp; if (prev_op == "*") running_result *= temp; if (prev_op == "/") running_result /= temp; if (prev_op == "-") running_result -= temp; if (prev_op == "=") running_result = temp; if (op == "=") numdisplay.innerText = running_result; else numdisplay.innerText=""; prev_op = op; }

<HTML> <title> My Calculator </title> <body> <style> .MyCalculator {width:240px; padding:10px; text-align:center; background-color:tan} button {margin-top:5px; font-size:150%; border-width:3px} button:active {border-style: inset} .NumBtn {width: 20%} .OpBtn {width:30%; color:red} .readout {width: 100%; height:1.3em; background-color:DarkSlateGrey; text-align:right; color:lawngreen; font-size:300%; font-family: monospace; font-weight:bold} </style> <div class="MyCalculator"> <div id=numdisplay class="readout">1234</div> <button class="NumBtn" onclick="PressNumberButton(1)">1</button> <button class="NumBtn" onclick="PressNumberButton(2)">2</button> <button class="NumBtn" onclick="PressNumberButton(3)">3</button> <br> <button class="NumBtn" onclick="PressNumberButton(4)">4</button> <button class="NumBtn" onclick="PressNumberButton(5)">5</button> <button class="NumBtn" onclick="PressNumberButton(6)">6</button> <br> <button class="NumBtn" onclick="PressNumberButton(7)">7</button> <button class="NumBtn" onclick="PressNumberButton(8)">8</button> <button class="NumBtn" onclick="PressNumberButton(9)">9</button> <br> <button class="NumBtn" onclick="PressNumberButton(0)">0</button> <button class="NumBtn" onclick="PressNumberButton('.')">.</button> <br> <hr> <button class="OpBtn" onclick="PressOperator('+')">+</button> <button class="OpBtn" onclick="PressOperator('*')">*</button> <button class="OpBtn" onclick="DoClear()">CLR</button> <br> <button class="OpBtn" onclick="PressOperator('-')">-</button> <button class="OpBtn" onclick="PressOperator('/')">/</button> <button class="OpBtn" onclick="PressOperator('=')">=</button> </div> <script> var running_result = 0; var prev_op = "="; function PressOperator (op) { var temp = Number(numdisplay.innerText); if (prev_op == "+") running_result += temp; if (prev_op == "*") running_result *= temp; if (prev_op == "/") running_result /= temp; if (prev_op == "-") running_result -= temp; if (prev_op == "=") running_result = temp; if (op == "=") numdisplay.innerText = running_result; else numdisplay.innerText=""; prev_op = op; } function DoClear() { numdisplay.innerText = ""; running_result = ""; } function PressNumberButton (n) { numdisplay.innerText += n; } </script> </body> </html>