در حال حاضر محصولی در سبد خرید شما وجود ندارد.
در برنامه نویسی Front-End و وب اگر در مورد DOM چیزی ندانید در حقیقت هیچ چیز نمی دانید. در این دوره آموزشی یاد می گیرید که چطور به کمک جاوااسکریپت می توانید هر تغییری و ویرایشی که دوست دارید در صفحات وب تنها از طریق DOM انجام دهید.
عنوان اصلی : Learn DOM Manipulation with Easy Modern JavaScript
خوش آمدی:
DOM چیست؟
اولین به روز رسانی DOM شما
پروژه دوره: کد DOM Adventure
اصول DOM:
HTML و DOM
استانداردهای DOM
BOM
CSSOM
درخت (ساختار داده)
درخت DOM
DOM و جاوا اسکریپت
کد ماجراجویی DOM:
معماری اپلیکیشن
راه حل چالش: صفحه خروجی
اسکلت برنامه
فایل Splash Screen
از جمله دارایی ها
ایجاد عناصر:
سیم کشی عنصر Splash Screen
ایجاد عناصر در زمان اجرا
افزودن عرض رشته های HTML Append()
اضافه کردن گره ها با Append یا AppendChild
ترتیب اسکریپت مهم است
CSS پویا:
تعیین کلاس ها به عناصر
کار با استاتیک استایل
تعریف سبک ها در زمان اجرا
پرس و جو از DOM برای یافتن عناصر
پروفایل Pixel Pipeline:
خط لوله پیکسل
شناسایی شیوه های بد
پروفایل عملکرد زمان اجرا
دسته‌بندی به‌روزرسانی‌های DOM با قطعات سند
گره های بسیار زیاد
انیمیشن با استفاده از تغییرات DOM:
حذف گره ها از DOM
قاب های انیمیشن
روش متحرک سازی ما
انیمیشن کاری ما!
توقف انیمیشن
برنامه ریزی تغییرات DOM با یک مدل حالت:
بیایید سطح را بسازیم!
2. مدل ایالتی ما برای کنترل DOM از ایالت.
عادی سازی ویژگی ها
کلاس سطح ما
آرایه ها، مراجع، و شکاف های خالی غیر قابل تکرار
ساختن ایالت ما با یک نفر زشت
برای انسان ها کد بنویسید و کد خود را عادی کنید
رندر کردن عنصر سطح
هوم، اوضاع در حال بهم ریختگی است
بسته بندی آسان:
بسته بندی آسان
بسته با اسکریپت شروع
سرور توسعه دهنده ما
بیایید از ماژول های DOMContentLoaded و ES (ESM) استفاده کنیم
عناصر سبک پویا با CSS به عنوان واردات ESM
به‌روزرسانی‌های DOM با توسعه پایه دولت محور:
طراحی شکل کشور ما
راه‌اندازی وضعیت ما در آماده‌سازی برای ارائه عناصر DOM
به روز رسانی های DOM از ایالت
به روز رسانی به State در DOM منعکس می شود
مدلسازی و رندر کردن دیوارهای چیپ ما
تعامل بازیکن با ورودی کاربر:
بازیکن - رویکرد فنی
رندر کردن پخش کننده با DOM
مدل جعبه و سبک های جهانی
دستکاری سبک های درون خطی با DOM
حرکت بازیکن با تغییر وضعیت آن
شنوندگان رویداد صفحه کلید DOM
نقشه برداری و فیلتر کردن داده های رویدادهای DOM
آیا بازیکن می تواند حرکت کند؟ - رویکرد فنی
جلوگیری از همپوشانی عناصر DOM
فریم های تعاملی را آماده کنید
بازنشانی ClassName و افزودن فریم های تعاملی در رویدادهای DOM
فریم ها را بدون جابجایی عنصر در رویدادهای DOM به روز کنید
DOM تعاملی، دیوارهای شکسته:
افزودن عناصر تصادفی DOM
رویدادهای DOM هنگام فشار دادن کلید Space
ایجاد عناصر در رویدادهای DOM
مانیفست Z-Index
شناسه عناصر پویا با DOM
تعامل با سایر عناصر با استفاده از مدل حالت
دیوارهای اطراف را بردارید
پورتال خروج از بازی:
افزودن پورتال به صفحه
عناصر تصادفی روی صفحه
گروه بندی به روز رسانی های درون خطی CSS DOM
خروج از بازی هنگامی که دو عنصر از مسیرها عبور می کنند
چالش: نوبت شما برای ساختن صفحه خروجی است
راه حل چالش: نوبت من برای ساختن صفحه خروج
پنهان کردن پورتال پشت دیوار
حذف شنوندگان رویداد DOM
متحرک سازی همه چیز:
رندر کردن Splash Screen
تعویض صفحه نمایش
متحرک سازی پورتال
کیت CSS - انیمیشن ها
درخواست قاب انیمیشن و تاخیر در انیمیشن
متحرک سازی با کلاس CSS والدین
جلوه تلویزیون قدیمی
متحرک سازی با انیمیشن تاخیری
بهینه سازی فریم ها
بهینه سازی فریم نهایی
جلوه های صوتی DOM:
عناصر صوتی پویا
جلوه های صوتی تعاملی با رویدادهای DOM
جلوه های صوتی تاخیری با تماس و رویدادهای DOM
سخنرانی پایانی، جلوه صوتی نهایی! خروج از بازی
Learn DOM Manipulation with Easy Modern JavaScript
در این روش نیاز به افزودن محصول به سبد خرید و تکمیل اطلاعات نیست و شما پس از وارد کردن ایمیل خود و طی کردن مراحل پرداخت لینک های دریافت محصولات را در ایمیل خود دریافت خواهید کرد.
