ডোম ডকুমেন্ট (DOM Document)

একটি ওয়েব পেজের সকল অবজেক্টের মালিক হলো এইচটিএমএল ডোম ডকুমেন্ট অবজেক্ট।


এইচটিএমএল ডোম ডকুমেন্ট অবজেক্ট

ডকুমেন্ট অবজেক্ট একটি পেজকে প্রদর্শন করে।

একটি এইচটিএমএল পেজের যেকোন এলিমেন্টকে এক্সেস করতে অবশ্যই ডকুমেন্ট অবজেক্ট দিয়ে শুরু করতে হবে।

নিম্নলিখিত উদাহরণে এইচটিএমএল এলিমেন্টকে কিভাবে এক্সেস এবং পরিচালনা করা যায় তা দেখানো হলো:


এইচটিএমএল এলিমেন্ট খুজে বের করা

মেথডবর্ণনা
document.getElementById(id)এলিমেন্টের id দ্বারা এলিমেন্টকে খুঁজে বের করা হয়
document.getElementsByTagName(name)ট্যাগের নাম দিয়ে এলিমেন্টকে খুঁজে বের করা হয়
document.getElementsByClassName(name)এলিমেন্টের class দ্বারা এলিমেন্টকে খুঁজে বের করা হয়

এইচটিএমএল এলিমেন্ট পরিবর্তন

মেথডবর্ণনা
element.innerHTML =  নতুন এইচটিএমএল কন্টেন্টএকটি এলিমেন্টের ভিতরের কন্টেন্টকে পরিবর্তন করে
element.attribute = নতুন ভ্যালুএইচটিএমএল এলিমেন্টের এট্রিবিউট ভ্যালু পরিবর্তন করে
element.setAttribute(এট্রিবিউট, ভেলু(value))এইচটিএমএল এলিমেন্টের এট্রিবিউট ভ্যালু পরিবর্তন করে
element.style.property = নতুন স্টাইলএইচটিএমএল এলিমেন্টের স্টাইল পরিবর্তন করে

এলিমেন্ট যোগ এবং বাদ দেওয়া

মেথডবর্ণনা
document.createElement(এলিমেন্ট)নতুন এলিমেন্ট তৈরি করে
document.removeChild(এলিমেন্ট)এইচটিএমএল এলিমেন্টকে মুছে দেয়
document.appendChild(এলিমেন্ট)এইচটিএমএল এলিমেন্ট যোগ করে
document.replaceChild(এলিমেন্ট)এইচটিএমএল এলিমেন্টকে প্রতিস্থাপন করে
document.write(টেক্সট)এইচটিএমএল ডকুমেন্টে লিখার জন্য ব্যবহার করে

ইভেন্ট হ্যান্ডলার সংযুক্ত করার পদ্ধতি

মেথডবর্ণনা
document.getElementById(id).onclick = function(){কোড}একটি অনক্লিক ইভেন্টে ইভেন্ট হ্যান্ডলার কোড যোগ করে

এইচটিএমএল অবজেক্টকে এক্সেস

প্রথম এইচটিএমএল ডোম আবিষ্কৃত হয় ১৯৯৮ সালে, যেখানে ১১টি এইচটিএমএল অবজেক্ট, অবজেক্ট কালেকশন এবং প্রোপার্টি ছিল। এগুলো এইচটিএমএল ৫ এ এখনো ভ্যালিড।

পরবর্তীতে এইচটিএমএল ডোম লেভেল ৩ এ আরও অবজেক্ট, অবজেক্ট কালেকশন, এবং প্রোপার্টি সংযুক্ত করা হয়েছে।

প্রোপার্টিবর্ণনাডোম
document.anchorsযেসকল এলিমেন্টের name এট্রিবিউট রয়েছে সেগুলোকে রিটার্ন করে
document.appletsসকল এলিমেন্টকে রিটার্ন করে (এইচটিএমএল 5 এ অনুমোদন বাদ দেয়া হয়েছে)
document.baseURIডকুমেন্টের base URI রিটার্ন করে
document.body এলিমেন্টকে রিটার্ন করে
document.cookieডকুমেন্টের কুকি রিটার্ন করে
document.doctypeডকুমেন্টের doctype এর নাম রিটার্ন করে
document.documentElement এলিমেন্টকে রিটার্ন করে
document.documentModeব্রাউজারের ব্যবহৃত মুডকে রিটার্ন করে
document.documentURIডকুমেন্টের URI রিটার্ন করে
document.domainডকুমেন্ট সার্ভারের ডোমেইনের নাম রিটার্ন করে
document.domConfigঅপ্রচলিত ডোম কনফিগারেশান রিটার্ন করে
document.embedsসকল এলিমেন্ট রিটার্ন করে
document.formsসকল
এলিমেন্ট রিটার্ন করে
document.head এলিমেন্ট রিটার্ন করে
document.imagesসকল এলিমেন্ট রিটার্ন করে
document.implementationডোম ইমপ্লিমেনটেশন রিটার্ন করে
document.inputEncodingডকুমেন্ট এনকোডিং রিটার্ন করে
document.lastModifiedডকুমেন্ট আপডেট হওয়ার তারিখ এবং সময় রিটার্ন করে
document.linksযেসকল এবং এলিমেন্টে href এট্রিবিউট রয়েছে সেগুলোকে রিটার্ন করে
document.readyStateডকুমেন্টের স্ট্যাটাস রিটার্ন করে
document.referrerলিঙ্কিং ডকুমেন্টের নির্দেশকের URI রিটার্ন করে1
document.scriptsসকল