آموزش مدل شی Document یا DOM در جاوا اسکریپت
آموزش مدل شی Document یا DOM در جاوا اسکریپت
در این درس از مجموعه آموزش برنامه نویسی سایت سورس باران، به آموزش مدل شی Document یا DOM در جاوا اسکریپت خواهیم پرداخت.
هر صفحه وب در داخل یک پنجره مرورگر قرار دارد که می تواند به عنوان یک شی در نظر گرفته شود.
یک شی Document HTML را نشان می دهد که در آن پنجره نمایش داده می شود. شی Document دارای خصوصیات مختلفی است که به اشیا دیگری اشاره دارد که اجازه دسترسی و تغییر در محتوای سند را می دهند.
نحوه دسترسی و اصلاح محتوای سند را Document Object Model یا DOM می نامند. اشیا در یک سلسله مراتب سازمان یافته اند. این ساختار سلسله مراتبی برای سازماندهی اشیا در یک سند وب اعمال می شود.
- Window object – بالای سلسله مراتب. این اصلی ترین عنصر سلسله مراتب شی است.
- Document object – هر سند HTML که در یک پنجره بارگیری می شود ، به یک شی document تبدیل می شود. این سند حاوی مطالب صفحه است.
- Form object– همه آنچه که در تگ <form> … </form> قرار دارد ، شکل شی را تنظیم می کند.
- Form object – شی object فرم شامل تمام عناصر تعریف شده برای آن شی مانند زمینه های نوشتاری ، دکمه ها ، دکمه های رادیویی و کادرهای تأیید است.
در اینجا یک سلسله مراتب ساده از چند مورد مهم وجود دارد –
چندین DOM وجود دارد. بخشهای زیر هر یک از این DOM ها را به طور مفصل توضیح داده و نحوه استفاده از آنها را برای دستیابی و اصلاح محتوای سند شرح می دهد.
- Legacy DOM – این مدلی است که در نسخه های اولیه زبان JavaScript معرفی شده است. توسط همه مرورگرها به خوبی پشتیبانی می شود ، اما فقط به بخشهای اصلی اسناد ، مانند فرمها ، عناصر فرم و تصاویر امکان دسترسی دارد.
- W3C DOM – این مدل شی document سند اجازه دسترسی و اصلاح کلیه محتوای سند را می دهد و توسط کنسرسیوم شبکه جهانی وب (W3C) استاندارد شده است. این مدل تقریباً توسط همه مرورگرهای مدرن پشتیبانی می شود.
- IE4 DOM – این مدل شی document سند در نسخه 4 مرورگر اینترنت اکسپلورر مایکروسافت معرفی شده است. نسخه های IE 5 و نسخه های بعدی شامل پشتیبانی از بیشتر ویژگی های اساسی W3C DOM است.
سازگاری DOM
اگر می خواهید یک اسکریپت با انعطاف پذیری برای استفاده از W3C DOM یا IE 4 DOM بسته به در دسترس بودن آنها بنویسید ، می توانید از روش آزمایش قابلیت استفاده کنید که ابتدا وجود یک روش یا ویژگی را بررسی می کند تا مشخص کند مرورگر توانایی مورد نظر شما. به عنوان مثال –
1 2 3 4 5 6 7 |
if (document.getElementById) { // If the W3C method exists, use it } else if (document.all) { // If the all[] array exists, use it } else { // Otherwise use the legacy DOM } |
لیست جلسات قبل آموزش جاوا اسکریپت
-
- آموزش جاوا اسکریپت
- نگاه کلی به آموزش جاوا اسکریپت
- آموزش نحو در جاوا اسکریپت
- آموزش فعال کردن جاوا اسکریپت در مرورگرها
- آموزش قرارگیری در فایل HTML در جاوا اسکریپت
- آموزش متغیرها در جاوا اسکریپت
- آموزش عملگرها در جاوا اسکریپت
- آموزش دستور if-else در جاوا اسکریپت
- آموزش دستور switch case در جاوا اسکریپت
- آموزش حلقه while در جاوا اسکریپت
- آموزش حلقه for در جاوا اسکریپت
- آموزش حلقه for…in در جاوا اسکریپت
- آموزش کنترل حلقه در جاوا اسکریپت
- آموزش توابع در جاوا اسکریپت
- آموزش رویدادها در جاوا اسکریپت
- آموزش کوکی ها در جاوا اسکریپت
- آموزش تغییر مسیر صفحه در جاوا اسکریپت
- آموزش کادر گفتگو در جاوا اسکریپت
- آموزش کلمه کلیدی Void در جاوا اسکریپت
- آموزش چاپ صفحه در جاوا اسکریپت
- بررسی اجمالی اشیا در جاوا اسکریپت
- آموزش شی Number در جاوا اسکریپ
- آموزش شی Boolean در جاوا اسکریپت
- آموزش شی رشته ها در جاوا اسکریپت
- آموزش شی آرایه ها در جاوا اسکریپت
- آموزش شی Date در جاوا اسکریپت
- آموزش شی Math در جاوا اسکریپت
- آموزش عبارات منظم و شی RegExp در جاوا اسکریپت
دیدگاه شما