एचटीएमएल और जावास्क्रिप्ट का उपयोग कर कैलकुलेटर बनाएं।None
मैं इसे दो भागों में टूटा रहूँगा। पहले भाग में, हम एचटीएमएल का उपयोग करके कैलकुलेटर के कुछ बेसिक फ़ीचर जैसे जोड़, घटाएं, गुणा और भाग करना कोड करेंगे।

HTML:

```
<div>
  <input type="text" id="input1" placeholder="Enter a number">
  <input type="text" id="input2" placeholder="Enter another number">
  <button onclick="add()">Add</button>
  <button onclick="subtract()">Subtract</button>
  <button onclick="multiply()">Multiply</button>
  <button onclick="divide()">Divide</button>
  <br><br>
  <p id="result"></p>
</div>
```

JavaScript:

```
function add() {
  var num1 = Number(document.getElementById("input1").value);
  var num2 = Number(document.getElementById("input2").value);
  var result = num1 + num2;
  document.getElementById("result").innerHTML = "Result: " + result;
}

function subtract() {
  var num1 = Number(document.getElementById("input1").value);
  var num2 = Number(document.getElementById("input2").value);
  var result = num1 - num2;
  document.getElementById("result").innerHTML = "Result: " + result;
}

function multiply() {
  var num1 = Number(document.getElementById("input1").value);
  var num2 = Number(document.getElementById("input2").value);
  var result = num1 * num2;
  document.getElementById("result").innerHTML = "Result: " + result;
}

function divide() {
  var num1 = Number(document.getElementById("input1").value);
  var num2 = Number(document.getElementById("input2").value);
  var result = num1 / num2;
  document.getElementById("result").innerHTML = "Result: " + result;
}
```

अब हम स्वयं के लिए एक अलग सा फ़ाइल बनाएँगे जो एक संपूर्ण कैलकुलेटर होगा। इसमें हम एचटीएमएल की जगह जावास्क्रिप्ट का उपयोग करके इसे बनायेंगे।

HTML:

```
<!DOCTYPE html>
<html>
<head>
	<title>Calculator</title>
</head>
<body>
	<div id="calculator">
		<div id="screen">
			<p id="input">0</p>
			<p id="output">0</p>
		</div>
		<div id="buttons">
			<button onclick="clearInput()">C</button>
			<button onclick="toggleSign()">+/-</button>
			<button onclick="percent()">%</button>
			<button class="operator" onclick="operation('/')">÷</button>
			<button onclick="input('7')">7</button>
			<button onclick="input('8')">8</button>
			<button onclick="input('9')">9</button>
			<button class="operator" onclick="operation('*')">x</button>
			<button onclick="input('4')">4</button>
			<button onclick="input('5')">5</button>
			<button onclick="input('6')">6</button>
			<button class="operator" onclick="operation('-')">-</button>
			<button onclick="input('1')">1</button>
			<button onclick="input('2')">2</button>
			<button onclick="input('3')">3</button>
			<button class="operator" onclick="operation('+')">+</button>
			<button onclick="input('0')">0</button>
			<button onclick="input('.')">.</button>
			<button onclick="calculate()">=</button>
		</div>
	</div>

	<script src="calculator.js"></script>
</body>
</html>
```

CSS:

```
#calculator {
	background-color: #fff;
	border: 2px solid #ccc;
	border-radius: 5px;
	margin: 0 auto;
	padding: 20px;
	width: 300px;
}

#screen {
	background-color: #333;
	border-radius: 5px;
	margin-bottom: 10px;
	padding: 5px;
}

#screen p {
	color: #fff;
	font-size: 20px;
	line-height: 30px;
	margin: 10px 0 0 0;
}

#input {
	font-size: 30px;
	text-align: right;
}

#output {
	font-size: 20px;
	text-align: right;
}

#buttons button {
	background-color: #ccc;
	border: none;
	border-radius: 5px;
	color: #333;
	cursor: pointer;
	font-size: 20px;
	height: 40px;
	margin: 5px;
	padding: 0 10px;
	width: 40px;
}

#buttons .operator {
	background-color: #f0f0f0;
	color: #333;
}

#buttons button:hover {
	background-color: #bbb;
}

#buttons button:active {
	background-color: #999;
}
```

JavaScript:

```
var inputEl = document.getElementById("input");
var outputEl = document.getElementById("output");
var operator = "";
var prevInput = "0";

function input(value) {
	if (inputEl.innerHTML === "0" && value !== ".") {
		inputEl.innerHTML = value;
	} else {
		inputEl.innerHTML += value;
	}
}

function clearInput() {
	inputEl.innerHTML = "0";
	outputEl.innerHTML = "0";
	prevInput = "0";
	operator = "";
}

function toggleSign() {
	inputEl.innerHTML = String(Number(inputEl.innerHTML) * -1);
}

function percent() {
	inputEl.innerHTML = String(Number(inputEl.innerHTML) * 0.01);
}

function operation(operatorType) {
	if (operator !== "") {
		calculate();
	}
	prevInput = inputEl.innerHTML;
	operator = operatorType;
	inputEl.innerHTML = "0";
}

function calculate() {
	var currentInput = Number(inputEl.innerHTML);
	var result;
	switch (operator) {
		case "+":
			result = Number(prevInput) + currentInput;
			break;
		case "-":
			result = Number(prevInput) - currentInput;
			break;
		case "*":
			result = Number(prevInput) * currentInput;
			break;
		case "/":
			result = Number(prevInput) / currentInput;
			break;
		default:
			result = "0";
	}
	prevInput = "0";
	operator = "";
	inputEl.innerHTML = "0";
	outputEl.innerHTML = result;
}

document.onkeypress = function(event) {
	var keyCode = event.keyCode || event.which;
	var keyValue = String.fromCharCode(keyCode);
	if (!isNaN(keyValue)) {
		input(keyValue);
	}
	if (keyValue === "+") {
		operation("+");
	}
	if (keyValue === "-") {
		operation("-");
	}
	if (keyValue === "*") {
		operation("*");
	}
	if (keyValue === "/") {
		operation("/");
	}
	if (keyCode === 13) {
		calculate();
	}
}
```

यह हमारे कैलकुलेटर का पूर्ण कोड है। इसे ब्राउज़र में खोलें और आनंद उठाएं!