এইচটিএমএল ডোম table অবজেক্ট
table অবজেক্ট
table অবজেক্ট একটি এইচটিএমএল <table> এলিমেন্ট ক প্রতিনিধিত্ব করে ।
table অবজেক্ট তৈরি
document.createElement() মেথড দ্বারা আপনি একটি <table> এলিমেন্ট তৈরি করতেপারবেন :
উদাহরণ
<!DOCTYPE html>
<html>
<head>
<title>জাভাস্ক্রিপ্ট উদাহরণ</title>
<style>
table, td {
border: 1px solid grey;
}
</style>
</head>
<body>
<button onclick="myFunc()">ক্লিক করুন</button>
<script>
function myFunc() {
var a = document.createElement("table");
a.setAttribute("id", "test");
document.body.appendChild(a);
var b = document.createElement("tr");
b.setAttribute("id", "test1");
document.getElementById("test").appendChild(b);
var c = document.createElement("td");
var d = document.createTextNode("টেবিল ডাটা");
c.appendChild(d);
document.getElementById("test1").appendChild(c);
}
</script>
</body>
</html>ফলাফল
এক্সেস table অবজেক্ট
getElementById() ব্যবহারের মাধ্যমে আপনি <table> এলিমেন্টকে এক্সেস করতে পারবেন :
উদাহরণ
<!DOCTYPE html>
<html>
<head>
<title>জাভাস্ক্রিপ্ট উদাহরণ</title>
<style>
table, td {
border: 1px solid grey;
}
</style>
</head>
<body>
<table id="test">
<tr>
<td>টেবিল ডাটা</td>
</tr>
<tr>
<td>টেবিল ডাটা</td>
</tr>
</table>
<button onclick="myFunc()">ক্লিক করুন</button>
<script>
function myFunc() {
var x = document.getElementById("test");
x.deleteRow(0);
}
</script>
</body>
</html>ফলাফল
table অবজেক্ট কালেকশন
| কালেকশনস | বর্ণনা |
|---|---|
| rows | একটি টেবিল এর মধ্যে সকল <tr> ইলিমন্টের কালেকশন রিটার্ন করে । |
| tBodies | একটি টেবিল এর মধ্যে সকল<tbody> ইলিমন্টের কালেকশন রিটার্ন করে । |
table অবজেক্ট প্রোপার্টি
| প্রোপার্টি | বর্ণনা |
|---|---|
| align | এইচটিএমএল ৫ এ সাপোর্ট করে না। এর পরিবর্তে
style.cssFloat ব্যবহার করুন । একটি টেবিলের লিখা শ্রেণীবিন্যাস করতে এলাইনমেন্ট সেট করে অথবা রিটার্ন করে । |
| background | এইচটিএমএল৫-এ সাপোর্ট করে না।এর পরিবর্তে
style.background ব্যবহার করুন । একটি টেবিলের ব্যাকগ্রাউন্ড ইমেজ সেট করে অথবা রিটার্ন করে । |
| bgColor | এইচটিএমএল৫-এ সাপোর্ট করে না।এর পরিবর্তে
style.backgroundColor ব্যবহার করুন । একটি টেবিলের ব্যাকগ্রাউন্ডকালার সেট করে অথবা রিটার্ন করে । |
| border | অনুমোদিত নয় । এর পরিবর্তে style.border
ব্যবহার করুন । টেবিল বর্ডারের প্রস্থ সেট করে অথবা রিটার্ন করে । |
| caption | একটি টেবিলের ক্যাপশন <caption> এলিমেন্ট রিটার্ন করে । |
| cellPadding | এইচটিএমএল৫-এ সাপোর্ট করে না।এর পরিবর্তে
style.padding ব্যবহার করুন । সেল বর্ডার এবং সেল কন্টেন্ট এর মধ্যে ফাঁকা তৈরি করতে ব্যবহার করা হয়। |
| cellSpacing | এইচটিএমএল৫-এ সাপোর্ট করে না। এর পরিবর্তে style.borderSpacing
ব্যবহার করুন । একটি টেবিলে সেল এর মধ্যে কি পরিমান ফাঁকা তাহবে তা সেট করে অথবা রিটার্ন করে । |
| frame | এইচটিএমএল৫-এ সাপোর্ট করে না। টেবিলের কোন আউটার-বর্ডার(outer-borders) প্রদর্শিত হবে তা সেট করে অথবা রিটার্ন করে |
| height | এইচটিএমএল৫-এ সাপোর্ট করে না।এর পরিবর্তে style.height
ব্যবহার করুন । একটি টেবিলের দৈর্ঘ্য(height) সেট করে অথবা রিটার্ন করে । |
| rules | এইচটিএমএল৫-এ সাপোর্ট করে না। একটি টেবিলের সেলের মধ্যে কোন ইনার-বর্ডার(inner-borders) প্রদর্শিত হবে তা সেট করে অথবা রিটার্ন করে । |
| summary | এইচটিএমএল৫-এ সাপোর্ট করে না। একটি টেবিলের ভেতরে ডেটার বর্ননা সেট করে অথবা রিটার্ন করে । |
| tFoot | একটি টেবিলের <tfoot> এলিমেন্টের রেফারেন্স সেট করে অথবা রিটার্ন করে। |
| tHead | একটি টেবিলের <thead> এলিমেন্টের রেফারেন্স রিটার্ন করে। |
| width | এইচটিএমএল৫-এ সাপোর্ট করে না।এর পরিবর্তে style.width
ব্যবহার করুন । টেবিলের প্রস্থ(width) সেট করে অথবা রিটার্ন করে । |
table অবজেক্ট মেথড
| মেথড | বর্ণনা |
|---|---|
| createCaption() | একটি খালি <caption> এলিমেন্ট তৈরি করে এবং তা টেবিলের সাথে যুক্ত করে । |
| createTFoot() | একটি খালি <tfoot> এলিমেন্ট তৈরি করে এবং টেবিলের সাথে যুক্ত করে । |
| createTHead() | একটি খালি <thead> এলিমেন্ট তৈরি করে এবং টেবিলের সাথে যুক্ত করে । |
| deleteCaption() | টেবিল থেকে প্রথম <caption> এলিমেন্ট বাদ দেয়া হয়। |
| deleteRow() | টেবিল থেকে একটি রো(row) <tr> বাদ হয়। |
| deleteTFoot() | টেবিল থেকে <tfoot> এলিমেন্ট বাদ দেওয়া হয়। |
| deleteTHead() | টেবিল থেকে <thead> এলিমেন্ট বাদ দেওয়া হয় । |
| insertRow() | একটি খালি <tr>এলিমেন্ট তৈরি করে এবং টেবিলের সাথে যুক্ত করে । |
স্ট্যান্ডার্ড প্রোপার্টিজ এবং ইভেন্ট
| প্রোপার্টি | ইভেন্ট |
|---|---|
| সাপোর্ট করে। এখানে দেখুন | সাপোর্ট করে। এখানে দেখুন |