Solution: Calculator
examples/js/calculator.html
<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=yes"> <title>Calculator</title> </head> <body> x: <input id="x"> operator: <input id="op"> y: <input id="y"> <button id="go">Calculate</button> <div id="result"></div> <script src="calculator.js"></script> </body> </html>
examples/js/calculator.js
"use strict"; function calculate() { var x = Number(document.getElementById('x').value); var y = Number(document.getElementById('y').value); var op = document.getElementById('op').value; var result; switch (op) { case '+' : { result = x+y; break; }; case '*' : { result = x*y; break; }; case '-' : { result = x-y; break; }; case '/' : { result = x/y; break; }; }; document.getElementById('result').innerHTML = result; return false; } document.getElementById('go').addEventListener('click', calculate);