Hello Friends Today, through this tutorial, I will tell you How to Write Program Complex Numbers calculator using JavaScript with HTML? Here’s a basic complex numbers calculator implemented using JavaScript and HTML. This calculator performs addition, subtraction, multiplication, and division of complex numbers:
index.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Complex Numbers Calculator</title>
</head>
<body>
<h1>Complex Numbers Calculator</h1>
<label for="real1">Real part of the first number: </label>
<input type="number" id="real1"><br>
<label for="imaginary1">Imaginary part of the first number: </label>
<input type="number" id="imaginary1"><br>
<label for="real2">Real part of the second number: </label>
<input type="number" id="real2"><br>
<label for="imaginary2">Imaginary part of the second number: </label>
<input type="number" id="imaginary2"><br>
<button onclick="add()">Add</button>
<button onclick="subtract()">Subtract</button>
<button onclick="multiply()">Multiply</button>
<button onclick="divide()">Divide</button><br>
<p id="result"></p>
<script>
function add() {
let real1 = parseFloat(document.getElementById('real1').value);
let imaginary1 = parseFloat(document.getElementById('imaginary1').value);
let real2 = parseFloat(document.getElementById('real2').value);
let imaginary2 = parseFloat(document.getElementById('imaginary2').value);
let resultReal = real1 + real2;
let resultImaginary = imaginary1 + imaginary2;
document.getElementById('result').textContent = `Result: ${resultReal} + ${resultImaginary}i`;
}
function subtract() {
let real1 = parseFloat(document.getElementById('real1').value);
let imaginary1 = parseFloat(document.getElementById('imaginary1').value);
let real2 = parseFloat(document.getElementById('real2').value);
let imaginary2 = parseFloat(document.getElementById('imaginary2').value);
let resultReal = real1 - real2;
let resultImaginary = imaginary1 - imaginary2;
document.getElementById('result').textContent = `Result: ${resultReal} + ${resultImaginary}i`;
}
function multiply() {
let real1 = parseFloat(document.getElementById('real1').value);
let imaginary1 = parseFloat(document.getElementById('imaginary1').value);
let real2 = parseFloat(document.getElementById('real2').value);
let imaginary2 = parseFloat(document.getElementById('imaginary2').value);
let resultReal = (real1 * real2) - (imaginary1 * imaginary2);
let resultImaginary = (real1 * imaginary2) + (real2 * imaginary1);
document.getElementById('result').textContent = `Result: ${resultReal} + ${resultImaginary}i`;
}
function divide() {
let real1 = parseFloat(document.getElementById('real1').value);
let imaginary1 = parseFloat(document.getElementById('imaginary1').value);
let real2 = parseFloat(document.getElementById('real2').value);
let imaginary2 = parseFloat(document.getElementById('imaginary2').value);
let denominator = (real2 * real2) + (imaginary2 * imaginary2);
let resultReal = ((real1 * real2) + (imaginary1 * imaginary2)) / denominator;
let resultImaginary = ((imaginary1 * real2) - (real1 * imaginary2)) / denominator;
document.getElementById('result').textContent = `Result: ${resultReal} + ${resultImaginary}i`;
}
</script>
</body>
</html>
This HTML file creates a form with input fields for the real and imaginary parts of two complex numbers, and buttons to perform addition, subtraction, multiplication, and division operations on them. The result of each operation is displayed below the buttons.