مقدمه
سورس کد HTML ماشین حساب یک ابزار ساده و کارآمد است که به ما امکان انجام محاسبات ریاضی را میدهد. این کد میتواند به سادگی نوشته شود و به راحتی قابل درک باشد. در ادامه به توضیحات کامل و جامع درباره این کد میپردازیم.
ساختار کلی HTML
در ابتدا، ما باید یک ساختار پایه برای صفحه HTML خود ایجاد کنیم. این ساختار شامل تگهای اصلی HTML، HEAD و BODY است.
```html
<!DOCTYPE html>
<html lang="fa">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=
- 0">
<link rel="stylesheet" href="style.css">
</head>
<body>
<div class="calculator">
<!-- محتویات ماشین حساب در اینجا قرار میگیرد -->
</div>
</body>
</html>
```
بخش ورودی
در داخل DIV ماشین حساب، باید یک بخش ورودی برای نمایش نتایج و اعداد ایجاد کنیم. این بخش معمولاً یک تگ INPUT است.
```html
<input type="text" id="result" disabled>
```
دکمهها
سپس، دکمههای ماشین حساب را اضافه میکنیم. این دکمهها شامل اعداد و عملگرها هستند. برای مثال:
```html
<button onclick="clearResult()">C</button>
<button onclick="appendToResult('1')">1</button>
<button onclick="appendToResult('2')">2</button>
<button onclick="appendToResult('+')">+</button>
```
کد جاوااسکریپت
حال نوبت به نوشتن توابع جاوااسکریپت میرسد. این توابع مسئول عملکرد ماشین حساب هستند. برای مثال، تابعی برای افزودن اعداد:
```javascript
function appendToResult(value) {
document.getElementById('result').value += value;
}
function clearResult() {
document.getElementById('result').value = '';
}
```
نتیجهگیری
با ترکیب این بخشها، میتوانید یک ماشین حساب ساده و کارآمد بسازید. این کد نه تنها به شما امکان انجام محاسبات را میدهد، بلکه یادگیری HTML و جاوااسکریپت را نیز تسهیل میکند. با کمی خلاقیت، میتوانید ویژگیهای جدیدی به آن اضافه کنید.