(3924) دستکاری DOM  صفحه وب ،و تغییر آلمان های یک (چک لیست یا لیست وظیفه)

---

شرح پروژه

سلام روزتون بخیر این ی تمرین کوچیکه هست ،که چند خط کد بیشتر نیست میخواستم ببینم از مجری هاتون کسی این تمرین رو می‌تونه انجام بده ،و اینکه توضیح هم لازم نیست ،فقط کد های html,css,Java  رو بفرسته کافیه،این رو به من خبر بدید که کسی انجام میده یا نه تا پنجشنبه صبح هم کدها را می‌خوام ،ممنون

هدف از این تمرین دستکاری DOM  صفحه وب ،و تغییر آلمان های یک (چک لیست یا لیست وظیفه )است .

۱)شما باید از صفر یک اپلیکیشن کوچیکه مدیریت وظیفه را(todolist)مانند عکس پیاده سازی کنید . ،آیتم  های لیست شما با استفاده از html پیاده سازی میشود و توسط css فرم دهی می‌شوند ،یک فرمی به شما اجازه  میدهد تا ورودی ها را به این لیست  اضافه کنید ،زمانی که ما روی یک آیتم در لیست کلیک میکنیم ،متن باید خط بخورد  و رنگ پشت  زمینه آیتم عوض میشه.با یک کلیک کردن جدید روی آیتم ،آیتم ها می‌توانند به شرایط قبل از انتخاب برگردند ،

اجرا:

۲)شما اجازه دارید از html.css.java(jquery) استفاده کنید .

HTML)

 یک لیست را که شامل چندین المان هست پیاده سازی کنید  و بر اساس نیازتانid _ class   تعریف کنید 

(در نظر بگیرید که آیتم ها می‌توانند بر اساس کلیک شدن یا نشدن دو ظاهر متفاوت داشته باشند ،)

۲)پیاده سازی کنید، 

 یک فیلد متنی را  و همینطور دکمه ای را  که اجازه بده به  لیست ،آیتم هایی اضافه کنیم

Css 

یک استایل (عمومی )برای لیستتان تعریف کنید( حذف نقطه کنار اول کلمه ،تعریف طول لیست ،و فونت. )

2) یک استایل برای آیتم های لیست تعریف کنید (...,pading،border)

3)یک استایل را برای آیتم های لیست به عنوان   نقش تکمیلی تعریف کنید (رنگ پشت زمینه متفاوت ومتن خط خورده)

jQuery)

1)استفاده از j Query برای انتخاب یک آیتم از لیست زمانی که  کلیک شود و در نتیجه تغییر استایلش به صورت پویا (برای رفتن از وضعیت که وظیفه های انجام شده  به رفتن به وضعیتی که وظیفه ای انجام نشده و برعکس  ،

۲)استفاده از jQuery  برای انتخاب یک  دکمه اضافه برای اجرای یک فعالیت، زمانی که کلیک میشود .

 ،

فعالیتی که باید انجام بشه :

بازیابی ارزش فیلد متن و اگر  خالی نیست یک آیتم لیست  جدید بسازید که به لیست موجود اضافه میکنید.

(شما DOM را با اضافه کردن به آیتم های  لیستتان،تغییر دادید.این آیتم های جدید از موارد قبل پیروی نمی‌کنند چون در حقیقت این ها پیوست شده اند.

برای حل این مشکل ما از  event deglation استفاده میکنیم ،evebt deglation برای وصل کردن وقایع به والد هستند ،

در هر صورت این آلمان های والد هست که از وقایع که در سطح فرزند رخ میدهد پیروی میکند .

متدی که باید استفاده شود متد ()  on 

$("sélecteurParent").on("click", "selectureEnfant", function() {

// Action à réaliser lorsque l'événement ‘‘click ’’

//Est détecté sur un élément ’’selecteurEnfant’’

});

//////////////////////////////////

معنی دو تا پیام بالا //

//عمل برای زمانی که کلیک شده 

//شناسایی روی آلمان های فرزند 

Sélecteur=selecture

Parent =parents

Enfants=children

از event deglation برای اجرای تغییرات در یک آیتم لیست استفاده کنید

عکس مربوط به تمرین هم براتون فرستادم ،

این پروژه شامل 1 فایل مهم است، لطفا قبل از ارسال پیشنهاد حتما نسبت به بررسی این فایل اقدام فرمایید.

مهارت ها و تخصص های مورد نیاز

---

---