HTML DOM Table অবজেক্ট

HTML DOM Table অবজেক্ট একটি HTML ডকুমেন্টের <table> এলিমেন্টকে রিপ্রেজেন্ট করে।

টেবিল অবজেক্ট তৈরি করার পদ্ধতি নিচে দেখানো হলো:

সিনট্যাক্স (Syntax)

document.createElement("TABLE");

প্রপার্টিগুলো (Properties)

টেবিল অবজেক্টের প্রপার্টিগুলো নিচে দেওয়া হলো:

প্রপার্টি	ব্যাখ্যা
caption	HTML ডকুমেন্টে টেবিলের `<caption>` এলিমেন্ট ফেরত দেয়।
tFoot	HTML ডকুমেন্টে টেবিলের `<tfoot>` এলিমেন্ট ফেরত দেয়।
tHead	HTML ডকুমেন্টে টেবিলের `<thead>` এলিমেন্ট ফেরত দেয়।

মেথডগুলো (Methods)

টেবিল অবজেক্টের মেথডগুলো নিচে দেওয়া হলো:

মেথড	ব্যাখ্যা
createCaption()	একটি খালি `<caption>` এলিমেন্ট তৈরি করে এবং টেবিলে যোগ করে।
createTFoot()	একটি খালি `<tfoot>` এলিমেন্ট তৈরি করে এবং টেবিলে যোগ করে।
createTHead()	একটি খালি `<thead>` এলিমেন্ট তৈরি করে এবং টেবিলে যোগ করে।
deleteCaption()	টেবিল থেকে প্রথম `<caption>` এলিমেন্ট মুছে দেয়।
deleteRow()	টেবিল থেকে একটি `<tr>` এলিমেন্ট মুছে দেয়।
deleteThead()	টেবিল থেকে `<thead>` এলিমেন্ট মুছে দেয়।
deleteTFoot()	টেবিল থেকে `<tfoot>` এলিমেন্ট মুছে দেয়।
insertRow()	একটি খালি `<tr>` এলিমেন্ট তৈরি করে এবং টেবিলে যোগ করে।

উদাহরণ (Example)

টেবিল অবজেক্টের একটি উদাহরণ দেখুন:

<!DOCTYPE html> 
<html> 
<head> 
<style> 
    body { 
        text-align: center; 
        background-color: #fff; 
        color: #0197F6; 
    } 
    h1 { 
        color: #23CE6B; 
    } 
    .btn { 
        background-color: #fff; 
        border: 1.5px dashed #0197F6; 
        height: 2rem; 
        border-radius: 2px; 
        width: 60%; 
        margin: 2rem auto; 
        display: block; 
        color: #0197F6; 
        outline: none; 
        cursor: pointer; 
    } 
</style> 
</head> 
<body> 
<h1>DOM table Object Demo</h1> 
<button onclick="createTable()" class="btn">Create a table object</button> 
<script> 
    function createTable() { 
        var table = document.createElement("TABLE"); 
        table.innerHTML = `  
            <td>Data 1</td>  
            <td>Data 2</td>  
            </tr>  
            <tr>  
            <td>Data 3</td>  
            <td>Data 4</td>  
            </tr>`; 
        table.setAttribute('border', "2"); 
        table.style.margin = "2rem auto"; 
        document.body.appendChild(table); 
    } 
</script> 
</body> 
</html>

আউটপুট (Output)

এটি নিম্নলিখিত আউটপুট তৈরি করবে:

HTML DOM Table অবজেক্ট

Create a table object বাটনে ক্লিক করলে একটি টেবিল অবজেক্ট তৈরি হবে:

HTML DOM Table অবজেক্ট