HTML DOM header অবজেক্ট HTML <header> এলিমেন্টের সাথে জড়িত যা HTML 5-এ পরিচয় করানো হয়েছিল। Header অবজেক্ট ব্যবহার করে createElement() এবং getElementById() মেথড যথাক্রমে <header> এলিমেন্ট তৈরি এবং এক্সেস করা যায়।
সিনট্যাক্স
header অবজেক্ট তৈরির সিনট্যাক্স:
var p = document.createElement("HEADER");উদাহরণ
HTML DOM header অবজেক্টের উদাহরণ:
<!DOCTYPE html> <html> <body> <h1>Header অবজেক্ট উদাহরণ</h1> <p>নিচের বাটনে ক্লিক করে header এলিমেন্ট তৈরি করুন</p> <button onclick="headerCreate()">CREATE</button> <script> function headerCreate() { var h = document.createElement("HEADER"); document.body.appendChild(h); var h2 = document.createElement("H2"); var txt = document.createTextNode("Header element containing a h2 element is now created"); h2.appendChild(txt); h.appendChild(h2); } </script> </body> </html>আউটপুট
এটি নিচের আউটপুট তৈরি করবে:
CREATE বাটনে ক্লিক করলে:
উপরের উদাহরণে:
CREATE বাটন তৈরি করা হয়েছে যা ইউজার ক্লিক করলে createHeader() মেথড এক্সিকিউট করবে:
<button onclick="headerCreate()">CREATE</button>
headerCreate() মেথড ডকুমেন্ট অবজেক্টের ওপর createElement() মেথড কল করে header এলিমেন্ট তৈরি করে এবং h ভেরিয়েবলে অ্যাসাইন করে। এটি তারপর appendChild() মেথড ডকুমেন্ট বডিতে কল করে header কে ডকুমেন্ট বডির চাইল্ড হিসেবে অ্যাপেন্ড করে। একই পদ্ধতিতে <h2> এলিমেন্ট এবং ডকুমেন্ট অবজেক্টের createTextNode() মেথড ব্যবহার করে এর জন্য একটি টেক্সট নোড তৈরি করা।
টেক্সট নোডটি appendChild() মেথড ব্যবহার করে <h2> এলিমেন্টে সংযুক্ত করা। শেষে <h2> এলিমেন্টটি টেক্সট নোডসহ header এলিমেন্টের চাইল্ড হিসেবে appendChild() মেথড ব্যবহার করে অ্যাপেন্ড করা হয়েছে:
function headerCreate() { var h = document.createElement("HEADER"); document.body.appendChild(h); var h2 = document.createElement("H2"); var txt = document.createTextNode("Header element containing a h2 element is now created"); h2.appendChild(txt); h.appendChild(h2); } 