کاربران گرامی در این پروژه به شما پروژه کاربردی با جاوا اسکریپت را قرارداده ایم شما عزیزان می توانید از بخش دانلود پروژه کاربردی با جاوااسکریپت سایر پروژه هایی که با جاوا اسکریپت طراحی شده اند را مشاهده و دانلود کنید.
در صورتی که نیاز به آموزش حضوری و یا غیر حضوری این پروژه داشتید میتوانید با ما در ارتباط باشید تا این پروژه را به شما آموزش دهیم حتی میتوانید در صورت دلخواه پروژه را به خواسته شما شخصی سازی کنیم لازم به ذکر است که تیم پروژه در صفحه دانلود پروژه کاربردی پروژه های مختلفی را به زبان های مختلف برنامه نویسی قرار داده است .شماره تماس با پرپروژه 09050394455 می باشد
### پروژه "ویرایشگر متن ساده" با استفاده از جاوا اسکریپت
ویرایشگر متن ساده یک ابزار کاربردی است که با استفاده از HTML، CSS و جاوا اسکریپت ساخته شده است. این ویرایشگر به کاربران این امکان را می‌دهد که متن را وارد کنند، ویرایش کنند و محتوای ویرایش شده را ذخیره یا بارگذاری کنند.
#### ویژگی‌های پروژه:
- **ویرایش متن:** کاربران می‌توانند متن را وارد و ویرایش کنند.
- **ذخیره متن:** امکان ذخیره محتوا به عنوان یک فایل متنی.
- **بارگذاری متن:** امکان بارگذاری محتوا از یک فایل متنی.
- **ساده و کاربرپسند:** طراحی ساده و کاربرپسند.
### کد منبع:
#### 1. فایل `index.html`
```html
Simple Text Editor
```
#### 2. فایل `styles.css`
```css
body {
font-family: Arial, sans-serif;
margin: 0;
padding: 0;
background-color: #f4f4f4;
}
.container {
width: 80%;
max-width: 800px;
margin: auto;
padding: 20px;
background: white;
border-radius: 8px;
box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
}
h1 {
text-align: center;
color: #333;
}
textarea {
width: 100%;
padding: 10px;
border: 1px solid #ccc;
border-radius: 4px;
resize: none;
font-size: 16px;
}
.buttons {
margin-top: 10px;
text-align: center;
}
button {
padding: 10px 15px;
margin: 5px;
border: none;
border-radius: 4px;
background-color: #5cb85c;
color: white;
cursor: pointer;
}
button:hover {
background-color: #4cae4c;
}
```
#### 3. فایل `app.js`
```javascript
document.addEventListener('DOMContentLoaded', () => {
const textEditor = document.getElementById('textEditor');
const saveButton = document.getElementById('saveButton');
const loadButton = document.getElementById('loadButton');
const fileInput = document.getElementById('fileInput');
// تابع برای ذخیره متن به عنوان فایل
saveButton.addEventListener('click', () => {
const text = textEditor.value;
const blob = new Blob([text], { type: 'text/plain' });
const url = URL.createObjectURL(blob);
const a = document.createElement('a');
a.href = url;
a.download = 'document.txt'; // نام فایل ذخیره شده
a.click();
URL.revokeObjectURL(url); // آزادسازی URL
});
// تابع برای بارگذاری متن از فایل
loadButton.addEventListener('click', () => {
fileInput.click(); // باز کردن دیالوگ انتخاب فایل
});
fileInput.addEventListener('change', (event) => {
const file = event.target.files[0];
const reader = new FileReader();
reader.onload = (e) => {
textEditor.value = e.target.result; // نمایش محتویات فایل در ویرایشگر
};
if (file) {
reader.readAsText(file); // خواندن محتویات فایل
}
});
});
```
### توضیحات پروژه:
1. **HTML:** ساختار اصلی ویرایشگر متن را تشکیل می‌دهد. شامل یک عنصر `
