کاربران گرامی در این پروژه به شما پروژه کاربردی با جاوا اسکریپت را قرارداده ایم شما عزیزان می توانید از بخش دانلود پروژه کاربردی با جاوااسکریپت سایر پروژه هایی که با جاوا اسکریپت طراحی شده اند را مشاهده و دانلود کنید.
در صورتی که نیاز به آموزش حضوری و یا غیر حضوری این پروژه داشتید میتوانید با ما در ارتباط باشید تا این پروژه را به شما آموزش دهیم حتی میتوانید در صورت دلخواه پروژه را به خواسته شما شخصی سازی کنیم لازم به ذکر است که تیم پروژه در صفحه دانلود پروژه کاربردی پروژه های مختلفی را به زبان های مختلف برنامه نویسی قرار داده است .شماره تماس با پرپروژه 09050394455 می باشد
در اینجا یک پروژه ساده برای تبدیل سن به تعداد روزها با استفاده از HTML، CSS و JavaScript ارائه شده است. در این برنامه کاربر سن خود را وارد میکند و برنامه آن را به تعداد روزها تبدیل میکند.
### 1. **HTML**
ابتدا ساختار HTML را برای تبدیل سن به تعداد روزها ایجاد میکنیم.
```html
تبدیل سن به تعداد روزها
تبدیل سن به تعداد روزها
```
### 2. **CSS**
برای طراحی ظاهری مبدل سن به تعداد روزها از CSS استفاده میکنیم.
```css
body {
font-family: Arial, sans-serif;
background-color: #f4f4f4;
display: flex;
justify-content: center;
align-items: center;
height: 100vh;
margin: 0;
}
.container {
background-color: #fff;
padding: 20px;
border-radius: 10px;
box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
text-align: center;
width: 300px;
}
h1 {
margin-bottom: 20px;
}
label {
display: block;
margin-bottom: 10px;
}
input {
padding: 10px;
font-size: 16px;
width: 80%;
margin-bottom: 20px;
}
button {
padding: 10px 20px;
font-size: 16px;
cursor: pointer;
background-color: #007bff;
color: white;
border: none;
border-radius: 5px;
}
.result {
margin-top: 20px;
font-size: 18px;
font-weight: bold;
color: #333;
}
```
### 3. **JavaScript**
سپس منطق برنامه را با JavaScript پیادهسازی میکنیم تا سن وارد شده را به تعداد روزها تبدیل کنیم.
```javascript
// انتخاب دکمه و فیلدهای ورودی
const convertBtn = document.getElementById('convertBtn');
const ageInput = document.getElementById('ageInput');
const resultDiv = document.getElementById('result');
// افزودن رویداد کلیک به دکمه
convertBtn.addEventListener('click', () => {
const age = parseInt(ageInput.value);
if (isNaN(age) || age <= 0) {
resultDiv.textContent = 'لطفاً یک سن معتبر وارد کنید!';
resultDiv.style.color = 'red';
} else {
const days = age * 365; // محاسبه تعداد روزها
resultDiv.textContent = `سن شما به روز: ${days} روز است.`;
resultDiv.style.color = 'black';
}
});
```
### توضیحات کد:
1. **HTML**: شامل عنوان، ورودی سن، دکمه تبدیل و نمایش نتیجه است.
2. **CSS**: طراحی ساده برای ایجاد یک رابط کاربری زیبا و کاربرپسند.
3. **JavaScript**:
- **گرفتن ورودی کاربر**: وقتی کاربر سن خود را وارد میکند، برنامه تعداد روزهای معادل آن را محاسبه میکند.
- **بررسی معتبر بودن ورودی**: اگر کاربر عددی نامعتبر وارد کند (مانند اعداد منفی یا غیر عدد)، برنامه پیام خطایی نمایش میدهد.
- **محاسبه تعداد روزها**: اگر سن معتبر باشد، آن را در 365 ضرب میکنیم تا تعداد روزها به دست آید.
### نتیجهگیری
این پروژه **تبدیل سن به تعداد روزها** یک مثال عالی برای استفاده از مفاهیم JavaScript مانند دستکاری DOM، مدیریت رویدادها و اعتبارسنجی ورودیهای کاربر است. این پروژه به راحتی میتواند گسترش یابد تا اطلاعات دقیقتری مانند محاسبه روزهای کبیسه نیز اضافه شود. از کدنویسی لذت ببرید!
| صفحه قابل مشاهده:
دانلود پروژه کاربردی ساده برای تبدیل سن به تعداد روزها با استفاده از HTML، CSS و JavaScript میباشد