HTML DOM Figure অবজেক্ট HTML <figure> এলিমেন্টকে রিপ্রেজেন্ট করতে ব্যবহৃত হয়। Figure অবজেক্ট ব্যবহার করে ডাইনামিকভাবে figure এলিমেন্ট তৈরি এবং এক্সেস করা যায়।
সিনট্যাক্স
Figure অবজেক্ট তৈরির সিনট্যাক্স:
var p = document.createElement("FIGURE");উদাহরণ
Figure অবজেক্ট তৈরির উদাহরণ:
<!DOCTYPE html> <html> <head> <script> function createFigure(){ var fig = document.createElement("FIGURE"); fig.setAttribute("id", "Figure1"); document.body.appendChild(fig); var i = document.createElement("IMG"); i.setAttribute("src", "https://www.tutorialspoint.com/servlets/images/servletsmini-logo.jpg"); i.setAttribute("width", "250"); i.setAttribute("height", "200"); i.setAttribute("alt", "Eiffel Tower"); fig.appendChild(i); } </script> </head> <body> <h2>HTML DOM figure অবজেক্ট</h2> <button onclick="createFigure()">CREATE</button><br><br> </body> </html>আউটপুট
এটি নিচের আউটপুট তৈরি করবে:
CREATE বাটনে ক্লিক করলে:
উপরের উদাহরণে:
প্রথমে CREATE বাটন তৈরি করা হয়েছে যা ইউজার ক্লিক করলে createFigure() ফাংশন এক্সিকিউট করবে:
<button onclick="createFigure()">CREATE>/button><br><br>
createFigure() ফাংশন ডকুমেন্ট অবজেক্টের createElement() মেথড ব্যবহার করে figure এলিমেন্ট তৈরি করে। setAttribute() ব্যবহার করে figure এলিমেন্টের id সেট করা এবং শেষে appendChild() মেথড ব্যবহার করে ডকুমেন্টের বডিতে অ্যাপেন্ড করা। তারপর img এলিমেন্ট তৈরি করা figure এলিমেন্টের ভিতরে ছবি রাখতে।
setAttribute() মেথড ব্যবহার করে img এলিমেন্টের src, width, height এবং alt মান সেট করা। শেষে img এলিমেন্টটি figure এলিমেন্টের চাইল্ড হিসেবে appendChild() মেথড ব্যবহার করে অ্যাপেন্ড করা হয়েছে:
function createFigure(){ var fig = document.createElement("FIGURE"); fig.setAttribute("id", "Figure1"); document.body.appendChild(fig); var i = document.createElement("IMG"); i.setAttribute("src", "EiffelTower.jpg"); i.setAttribute("width", "250"); i.setAttribute("height", "200"); i.setAttribute("alt", "Eiffel Tower"); fig.appendChild(i); } 