HTML DOM DD অবজেক্ট

HTML DOM DD অবজেক্টটি HTML ডকুমেন্টে ডেফিনিশন লিস্টকে নির্দেশকারী <dl> এলিমেন্টের ভিতরে থাকা <dd> এলিমেন্টের সাথে সম্পর্কিত।

সিনট্যাক্স

নিচে দেওয়া হলো -

DD অবজেক্ট তৈরি করার সিনট্যাক্স -

var p = document.createElement("DD");

উদাহরণ

HTML DOM DD অবজেক্টের একটি উদাহরণ দেখি -

<!DOCTYPE html> <html> <body> <h2>dd object example</h2> <p>নিচের বাটনে ক্লিক করুন কিছু টেক্সটসহ একটি dd এলিমেন্ট তৈরি করতে</p> <button onclick="create_dd()">CREATE</button><br><br> <dl id="DL1"> <dt>Mango</dt> </dl> <script> function create_dd() { var d = document.createElement("DD"); var txt = document.createTextNode("Mango is called the king of fruits."); d.appendChild(txt); var ele = document.getElementById("DL1"); ele.appendChild(d); } </script> </body> </html>

আউটপুট

এটি নিচের আউটপুট তৈরি করবে -

HTML DOM DD অবজেক্ট

CREATE বাটনে ক্লিক করলে -

HTML DOM DD অবজেক্ট

উপরের উদাহরণে -

আমরা "DL1" আইডি সহ একটি ডেফিনিশন লিস্ট তৈরি করেছি। এর ভিতরে একটি <dt> এলিমেন্ট রয়েছে -

<dl id="DL1"> <dt>Mango</dt> </dl>

তারপর আমরা একটি CREATE বাটন তৈরি করেছি যা ইউজার ক্লিক করলে create_dd() মেথড এক্সিকিউট করবে -

<button onclick="create_dd()">CREATE</button><br><br>

create_dd() মেথড ডকুমেন্ট অবজেক্টের createElement() মেথড ব্যবহার করে একটি <dd> এলিমেন্ট তৈরি করে এবং ভেরিয়েবল d-এ অ্যাসাইন করে। এরপর createTextNode() মেথড ব্যবহার করে একটি টেক্সট নোড তৈরি করে এবং ভেরিয়েবল txt-এ অ্যাসাইন করে। টেক্সট নোডটি appendChild() মেথড ব্যবহার করে <dd> এলিমেন্টের চাইল্ড হিসেবে অ্যাপেন্ড করা হয়।

টেক্সট নোডসহ <dd> এলিমেন্টটি তারপর আবার appendChild() মেথড ব্যবহার করে ডেফিনিশন লিস্টের চাইল্ড হিসেবে অ্যাপেন্ড করা হয় -

function create_dd() { var d = document.createElement("DD"); var txt = document.createTextNode("Mango is called the king of fruits."); d.appendChild(txt); var ele = document.getElementById("DL1"); ele.appendChild(d); }