js basics i-assess 1
Sat Oct 19 2024 09:11:58 GMT+0000 (Coordinated Universal Time)
Saved by @signup #html #javascript
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Simple Calculator</title> <style> body { font-family: Arial, sans-serif; text-align: center; margin-top: 50px; } input { margin: 5px; padding: 10px; width: 100px; } button { padding: 10px 15px; margin: 5px; } </style> </head> <body> <h1>Calculator</h1> <h3>Simple Calculator</h3> <!-- Updated H3 tag here --> <input type="number" id="value1" placeholder="Enter first number"> <input type="number" id="value2" placeholder="Enter second number"> <div> <button name="add" onclick="add()">ADDITION</button> <button name="sub" onclick="sub()">SUBTRACT</button> <button name="mul" onclick="mul()">MULTIPLY</button> <button name="div" onclick="div()">DIVISION</button> </div> <div id="result"></div> <script> function add() { const value1 = parseFloat(document.getElementById('value1').value); const value2 = parseFloat(document.getElementById('value2').value); const sum = value1 + value2; document.getElementById('result').innerText = 'Addition of ' + value1 + ' and ' + value2 + ' is ' + sum; } function sub() { const value1 = parseFloat(document.getElementById('value1').value); const value2 = parseFloat(document.getElementById('value2').value); const difference = value1 - value2; document.getElementById('result').innerText = 'Subtraction of ' + value1 + ' and ' + value2 + ' is ' + difference; } function mul() { const value1 = parseFloat(document.getElementById('value1').value); const value2 = parseFloat(document.getElementById('value2').value); const product = value1 * value2; document.getElementById('result').innerText = 'Multiplication of ' + value1 + ' and ' + value2 + ' is ' + product; } function div() { const value1 = parseFloat(document.getElementById('value1').value); const value2 = parseFloat(document.getElementById('value2').value); if (value2 === 0) { document.getElementById('result').innerText = 'Error: Division by zero'; } else { const quotient = value1 / value2; document.getElementById('result').innerText = 'Division of ' + value1 + ' and ' + value2 + ' is ' + quotient; } } </script> </body> </html>
Comments