×
ribbon

آموزش کار کردن با دام (Document Object Model)

مدرس:

ابوالفضل وفادوست

این دوره شما را به دنیای جذاب DOM (Document Object Model) می برد؛ جایی که یاد می گیرید... بیشتر
گواهی‌نامه
4.8 (5)
3 دیدگاه
227دانشجو
1:52ساعت
سرفصل‌ها
متوسط سطح دوره

اشتراک مکتب‌پلاس

خرید اشتراک

با خرید اشتراک مکتب‌پلاس، علاوه بر این دوره، به بیش از ۴،۰۰۰ دوره دیگر دسترسی خواهید داشت.

دسترسی به تمام دوره‌هابیش از ۴،۰۰۰ دوره
محتوای دوره
سرفصل‌ها
پیش‌نیاز‌ها
توضیحات دوره
دیدگاه کاربران
درباره مدرس

آنچه در این دوره می‌آموزید

آشنایی با دام (Document Object Model)

جستجوی آیتم‌ها در دام / Querying and Traversing the DOM

ویرایش دام / Working with the DOM

استفاده از ایونت‌ها / Working with Events

این دوره شامل:

2 ساعت ویدئو

گواهینامه مکتب‌خونه

دسترسی مادام‌العمر به محتوای دوره

سرفصل‌های دوره

3 فصل35 جلسه1:52 ساعت ویدیو
جستجوی آیتم ها در دام - Querying and Traversing the DOM
  What's the DOM - دام یا داکیومنت آبجکت مادل چیست؟
04:56
  Querying the DOM: Finding a single Element - جستجو در دام:‌ پیدا کردن یک آیتم تکی
04:44
  Querying the DOM: Finding Multiple Elements - جستجو در دام:‌ پیدا کردن چند آیتم
04:28
  Traversing the DOM: Finding Child Elements - ترورس کردن در دام:‌ پیدا کردن زیر مجموعه‌های یک آیتم
05:12
  Traversing the DOM: Finding Parent Elements - ترورس کردن در دام:‌ پیدا کردن والد یک آیتم
03:12
  Traversing the DOM: Finding Sibling Elements - ترورس کردن در دام:‌ پیدا کردن آیتم‌های همسایه
02:04
ویرایش دام - Working with the DOM
  innerHTML - اینر اچ تی ام ال
02:22
  insertAdjacentHTML - اینسرت ادجیسنت اچ تی ام ال
03:20
  createElement - کریت المنت
03:00
  Fragments - فرگمنت
02:52
  Templates - تگ تمپلیت
02:40
  Inserting Scripts - وارد کردن تگ اسکریپت
02:01
  Replacing, Cloning and Removing DOM Elements - جایگزین، کلون و حذف کردن المان‌ها
03:32
  Changing Attributes - ویرایش اتریبیوت
06:40
  Changing Styles - ویرایش استایل
02:34
  Changing Classes - ویرایش کلس
02:04
  Changing Data - ویرایش دیتا
02:09
  Working with Size and Position - کار کردن با ابعاد و پوزیشن
05:02
  Working with Scroll - کار کردن با اسکرول
02:47
استفاده از ایونت ها - Working with Events
  Events - ایونت‌ها
01:46
  Adding and Removing Event Listeners - افزودن و حذف ایونت لیستنر
04:12
  Keyboard Events - ایونت‌های کیبورد
03:04
  Event Bubbling and Capturing - ایونت بابلینگ و کپچرینگ
03:28
  stopPropagation - استاپ پراپگیشن
02:26
  Event Delegation - ایونت دلیگیشن
06:57
  Finding Forms - پیدا کردن فرم
02:40
  Handling Text Inputs / هندل کردن اینپوت تکست
04:05
  Handling Radio Inputs and Check boxes / هندل کردن اینپوت ریدیو و چک باکس
03:29
  Handling Select - هندل کردن سلکت
02:40
  Handling File Upload / هندل کردن آپلود فایل
01:19
  preventDefault - پرونت دیفالت
01:52
  Using Query Strings - استفاده از کوئری استرینگ
05:13
  Using JSON - استفاده از جیسان
01:18
  Using multipart/form-data - استفاده از مولپی پارت فرم دیتا
01:34
  The Next Step - قدم بعدی
00:51

پیش‌نیاز‌ها

برای استفاده از این دوره آشنایی با اچ تی ام ال، سی اس اس و جاوا اسکریپت مقدماتی مورد نیاز است.

توضیحات دوره

این دوره شما را به دنیای جذاب DOM (Document Object Model) می‌برد؛ جایی که یاد می‌گیرید چگونه با عناصر HTML تعامل کنید، آن‌ها را دستکاری کنید و صفحات وب پویا و تعاملی بسازید.

مباحث کلیدی دوره آموزش کار کردن با DOM یا Document Object Model

آشنایی با DOM: مفاهیم بنیادی DOM، ساختار درخت‌مانند آن و چگونگی نمایش صفحات وب در این ساختار را فرا خواهید گرفت.


جستجو در DOM: روش‌های مختلف جستجو و انتخاب عناصر را یاد خواهید گرفت، از روش‌های ساده مانند getElementById گرفته تا روش‌های قدرتمندتر مانند querySelector و querySelectorAll.


پیمایش در DOM: نحوه پیمایش در درخت DOM و یافتن عناصر والد، فرزند و همسایه را به صورت موثر خواهید آموخت.

ویرایش عناصر:
تغییر محتوای عناصر با استفاده از innerHTML و insertAdjacentHTML
ایجاد عناصر جدید با استفاده از createElement
کار با Fragments
درج، حذف، جایگزینی و کپی کردن عناصر

استایل دهی:
تغییر Attributes
کنترل استایل‌ با استفاده از CSS
مدیریت کلاس‌ها

پردازش رویدادها:
اضافه و حذف Event Listeners
مدیریت رویدادهای کیبورد
درک Event Bubbling & Capturing
پیاده‌سازی Event Delegation

کار با فرم‌ها:
مدیریت ورودی‌های مختلف فرم مانند متن، انتخاب، رادیو و چک‌باکس
پردازش آپلود فایل‌ها

کار با Query Strings 
کار با JSON
کار با multipart/form-data


این دوره برای چه کسانی مناسب است؟

توسعه‌دهندگان وب مبتدی و متوسط
افرادی که می‌خواهند مهارت‌های خود در زمینه ساخت صفحات وب پویا را ارتقا دهند
تمام افرادی که علاقه‌مند به یادگیری اصول ساختار و دستکاری عناصر HTML هستند


در پایان این دوره، شما به توانایی لازم برای ساخت صفحات وب تعاملی و پویا با استفاده از مفاهیم DOM دست خواهید یافت.

دیدگاه کاربران

4.8

بر اساس امتیاز 5 دانشجو

1
2
3
4
5

بهناز حقیقی بین کلائی

4 روز پیش

5

عالی

حسن جعفری

1 سال پیش

5

دوره خوب و مفیدی بود. ممنون از مکتب خونه

شقایق قدیمی

4 روز پیش

4

اموزش دقیق با بیان جزئیات هر متود و به فهم خوب این مبحث کمک میکنه

گواهینامه اختصاصی دو زبانه

پس از گذراندن دوره به صورت آنلاین در سایت مکتب‌خونه، گواهی‌نامه رسمی پایان دوره به زبان فارسی و انگلیسی، توسط مکتب‌خونه به اسم شما صادر شده و در اختیار شما قرار می‌گیرد.

امکان اشتراک گذاری در لینکدین
دو زبانه
8دوره
11,083دانشجو
458نظر و امتیاز

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

ایشان تجربه فعالیت به عنوان برنامه نویس فول استک در  استارت آپ‌های مختلف  را در کارنامه خود دارد.

از سوابق آموزشی ایشان می توان به بیش از ۸ سال سابقه تدریس، تولید محتوا و مدیریت آموزشی در حوزه‌های مختلف از جمله زبان انگلیسی و برنامه نویسی اشاره نمود.

مهارت‌هایی که می‌آموزید

دوره‌های مشابه

دیگر دوره‌های ابوالفضل وفادوست

سوالات پرتکرار

آیا بعد از پایان مدت دوره همچنان به محتوای آن دسترسی دارم؟

بله. پس از پایان مدت دوره نیز به ویدئوها، تمرین‌ها، پروژه‌ها و سایر محتوای آموزشی دوره دسترسی خواهید داشت؛ اما امکان تصحیح تمرین‌ها توسط پشتیبان دوره و دریافت گواهی‌نامه برای شما وجود نخواهد داشت.