HTML DOM Code অবজেক্ট

HTML DOM Code অবজেক্টটি HTML 5 <code> ট্যাগের সাথে সম্পর্কিত। এটি একটি কোডের টুকরো মার্ক আপ করার জন্য ব্যবহৃত হয় <code> এলিমেন্টের ভিতরে এটি ঢেকে দিয়ে। Code অবজেক্ট মূলত <code> এলিমেন্টকে রিপ্রেজেন্ট করে।

সিনট্যাক্স

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

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

var a = document.createElement("CODE");

উদাহরণ

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

<!DOCTYPE html> <html> <body> <p>নিচের বাটনে ক্লিক করুন কিছু টেক্সটসহ CODE এলিমেন্ট তৈরি করতে</p> <button onclick="createCode()">CREATE</button><br><br> <script> function createCode() { var x = document.createElement("CODE"); var t = document.createTextNode("print('HELLO WORLD')"); x.appendChild(t); document.body.appendChild(x); } </script> </body> </html>

আউটপুট

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

HTML DOM Code অবজেক্ট

CREATE-এ ক্লিক করলে -

HTML DOM Code অবজেক্ট

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

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

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

createCode() মেথড ডকুমেন্ট অবজেক্টের createElement("CODE") মেথড ব্যবহার করে একটি <code> এলিমেন্ট তৈরি করে। তৈরি এলিমেন্টটি ভেরিয়েবল x-এ অ্যাসাইন করা হয়। তারপর ডকুমেন্ট অবজেক্টের createTextNode() মেথড ব্যবহার করে কিছু টেক্সটসহ একটি টেক্সট নোড তৈরি করা হয়। এই টেক্সট নোডটি x ভেরিয়েবলের appendChild() মেথড ব্যবহার করে <code> এলিমেন্টের চাইল্ড হিসেবে অ্যাপেন্ড করা হয়।

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

function createCode() { var x = document.createElement("CODE"); var t = document.createTextNode("print('HELLO WORLD')"); x.appendChild(t); document.body.appendChild(x); }