آموزش Document Object Series 2021 - Part 3: Manipulating & Traversing Document Object Model

درس ها Lessons

• کودکان در مقابل childNodes - یک مثال Children vs childNodes - an example

• چالش کلاس نهایی - راه حل Final Class Challenge - solution

• تفاوت بین سند و سند The difference between Document & document

• تجزیه و تحلیل کد کلون ما Analyzing our clone code

• چرا باید از DOM عبور کنیم؟ Why do we need to traverse the DOM?

• متد insertBefore() - مثال The insertBefore() method - example

• حرکت در اطراف DOM Moving around the DOM

• خواهر و برادر Siblings

• گره والد Parent node

• کودکان - مثال Children - example

• عناصر شبیه سازی Cloning elements

• والدین، فرزندان و خواهر و برادر Parent, children and siblings

• 3 شیء مهم The 3 most important objects

• استفاده از textContent() برای افزودن متن به یک عنصر Using textContent() to add text to an element

• کلاس Outro Class Outro

• متد appendChild(). The appendChild() method

• فریب متد insertBefore() Tricking the insertBefore() method

• چالش کلاس نهایی - مقدمه Final Class Challenge - intro

• چالش - راه حل Challenge - solution

• متد remove(). The remove() method

• خواهر و برادر - مثال Siblings - example

• خواهر و برادر قبلی و بعدی Previous and next siblings

• نحوه حذف عناصر از DOM How to remove elements from the DOM

• بیایید یک عنصر به DOM اضافه کنیم Let's add an element to the DOM

• چالش - مقدمه Challenge - intro

• اکنون زمان ایجاد عناصر پویا است Now it's time to create dynamic elements

• سایت های استاتیک در مقابل پویا Static vs Dynamic sites

• استفاده از parentNode با removeChild Using parentNode with removeChild

• بچه ها، اولين فرزند و آخرين فرزند Children, firstChild and lastChild

• آیا متد insertAfter() وجود دارد؟ Is there an insertAfter() method?

• ساخت صفحه ما Building our page

• اطلاعات بیشتر در مورد createElement() More on createElement()

• فرزندان و نوادگان Children and descendants

• کلاس معرفی - دستکاری DOM Class Intro - Manipulating the DOM

• شبیه سازی - مثال Cloning - example

• () createElement از کجا آمده است؟ Where does createElement() come from?

• خلاصه Summary

درس ها Lessons

• کلاس معرفی - دستکاری DOM Class Intro - Manipulating the DOM

• شبیه سازی - مثال Cloning - example

• متد remove(). The remove() method

• فریب متد insertBefore() Tricking the insertBefore() method

• اطلاعات بیشتر در مورد createElement() More on createElement()

• چالش کلاس نهایی - راه حل Final Class Challenge - solution

• خواهر و برادر قبلی و بعدی Previous and next siblings

• چالش کلاس نهایی - مقدمه Final Class Challenge - intro

• کلاس Outro Class Outro

• کودکان - مثال Children - example

• چالش - راه حل Challenge - solution

• () createElement از کجا آمده است؟ Where does createElement() come from?

• خواهر و برادر Siblings

• اکنون زمان ایجاد عناصر پویا است Now it's time to create dynamic elements

• 3 شیء مهم The 3 most important objects

• چرا باید از DOM عبور کنیم؟ Why do we need to traverse the DOM?

• والدین، فرزندان و خواهر و برادر Parent, children and siblings

• بچه ها، اولين فرزند و آخرين فرزند Children, firstChild and lastChild

• متد appendChild(). The appendChild() method

• حرکت در اطراف DOM Moving around the DOM

• عناصر شبیه سازی Cloning elements

• تجزیه و تحلیل کد کلون ما Analyzing our clone code

• خلاصه Summary

• نحوه حذف عناصر از DOM How to remove elements from the DOM

• خواهر و برادر - مثال Siblings - example

• تفاوت بین سند و سند The difference between Document & document

• استفاده از textContent() برای افزودن متن به یک عنصر Using textContent() to add text to an element

• متد insertBefore() - مثال The insertBefore() method - example

• سایت های استاتیک در مقابل پویا Static vs Dynamic sites

• ساخت صفحه ما Building our page

• چالش - مقدمه Challenge - intro

• آیا متد insertAfter() وجود دارد؟ Is there an insertAfter() method?

• گره والد Parent node

• استفاده از parentNode با removeChild Using parentNode with removeChild

• فرزندان و نوادگان Children and descendants

• بیایید یک عنصر به DOM اضافه کنیم Let's add an element to the DOM

• کودکان در مقابل childNodes - یک مثال Children vs childNodes - an example