নিম্নলিখিত বিভিন্ন ধরনের DOM জাভাস্ক্রিপ্ট-এ কন্টেন্ট অ্যাক্সেস এবং পরিবর্তন করার জন্য উপলব্ধ রয়েছে -
- The Legacy DOM৷ − এটি সেই মডেল যা জাভাস্ক্রিপ্ট ভাষার প্রাথমিক সংস্করণে চালু করা হয়েছিল। এটি সমস্ত ব্রাউজার দ্বারা সমর্থিত কিন্তু নথির শুধুমাত্র নির্দিষ্ট কিছু অংশে অ্যাক্সেসের অনুমতি দেয়, যেমন ফর্ম, ফর্ম উপাদান এবং ছবি৷
- W3C DOM − নথি অবজেক্ট মডেলটি সমস্ত নথির বিষয়বস্তুর অ্যাক্সেস এবং পরিবর্তনের অনুমতি দেয় এবং ওয়ার্ল্ড ওয়াইড ওয়েব কনসোর্টিয়াম (W3C) দ্বারা প্রমিত। এই মডেলটি প্রায় সমস্ত আধুনিক ব্রাউজার দ্বারা সমর্থিত৷ ৷
- IE4 DOM - ডকুমেন্ট অবজেক্ট মডেলটি মাইক্রোসফটের ইন্টারনেট এক্সপ্লোরার ব্রাউজারের 4 সংস্করণে চালু করা হয়েছিল। IE 5 এবং পরবর্তী সংস্করণগুলিতে বেশিরভাগ মৌলিক W3C DOM বৈশিষ্ট্যগুলির জন্য সমর্থন রয়েছে৷
উদাহরণ
W3C DOM পদ্ধতি ব্যবহার করে ডকুমেন্টের বৈশিষ্ট্যগুলি অ্যাক্সেস করার একটি উদাহরণ দেখা যাক।
<html>
<head>
<title> Document Title </title>
<script type="text/javascript">
<!--
function myFunc()
{
var ret = document.getElementsByTagName("title");
alert("Document Title : " + ret[0].text );
var ret = document.getElementById("heading");
alert(ret.innerHTML );
}
//-->
</script>
</head>
<body>
<h1 id = "heading">This is main title</h1>
<p>Click the following to see the result:</p>
<form id = "form1" name = "FirstForm">
<input type = "button" value = "Click Me" onclick = "myFunc();" />
<input type = "button" value = "Cancel">
</form>
<form d = "form2" name = "SecondForm">
<input type = "button" value = "Don't ClickMe"/>
</form>
</body>
</html> 