روش های DOM جاوااسکریپت

روش های DOM جاوااسکریپت

دسته بندی : آموزش Javascript سطح مقاله : متوسط زمان مطالعه : 4 دقیقه آخرین بروز رسانی: 20 اسفند 1399

اگر می خواهید از JavaScript در توسعه وب استفاده کنید ، یکی از مهمترین مواردی که باید در مورد آن بدانید Document Object Model یا به سادگی DOM است. دانستن اینکه روش های DOM جاوااسکریپت چیست ، چگونه کار می کند و چگونه می توانید به آن دسترسی پیدا کنید ، به شما امکان می دهد کنترل بیشتری بر روی کد خود داشته باشید.

در این درس ، شما با روشهای JavaScript DOM، نحوه هدف قرار دادن عناصر در HTML با JavaScript و نحوه دستکاری آن ها آشنا خواهید شد.

نکات اصلی روش های DOM جاوااسکریپت:

  • یک روش JavaScript DOM به عنوان عملی وجود دارد که می تواند روی عناصر HTML اجرا شود.
  • عناصر HTML دارای خصوصیاتی هستند که اساساً مقادیر قابل تغییر هستند.
  • در DOM عناصر HTML به عنوان اشیا طبقه بندی می شوند.
  • خاصیت innerHTML ساده ترین راه برای نمایش چیزی در داخل یک عنصر است.

استفاده از DOM

در مثال جاوا اسکریپت DOM در زیر ، عنصر<p> را با استفاده از روش getElementById و گرفتن عنصر p id id = “demoz” هدف قرار می دهیم. محتوای عنصر <p> با استفاده از ویژگی innerHTML دستکاری می شود:

document.getElementById("example").innerHTML = "Hi there!";

توجه: شما می توانید از ویژگی innerHTML برای تغییر تمام محتوای عناصر HTML استفاده کنید. این برای تگ <html> و <body> نیز کار می کند.

خلاصه روش های DOM جاوااسکریپت:

  • یکی از ساده ترین راه ها برای هدف قرار دادن یک عنصر HTML که اغلب در JavaScript استفاده می شود ، روش getElementById است.
  • نمایش محتوا در یک عنصر به راحتی و معمولاً با استفاده از ویژگی innerHTML انجام می شود. در اینجا می توانید درباره استفاده از آن بیشتر بیاموزید.
  • برای اینکه درک بهتری از DOM داشته باشید ، به آموزش ناوبری HTML DOM JavaScript مراجعه کنید.

این مقاله چقدر براتون مفید بود؟

اولین امتیاز را ثبت کنید😊