HTML DOM TBody Object

Last Updated : 14 Jul, 2022

The tbody object in HTML DOM is used to represent the HTML <tbody> element. The <tbody> element can be accessed by using getElementById() method.

Syntax: The following is the syntax for accessing the <tbody> element.

document.getElementById("id");

Property Value

align: Set the alignment of the content.
valign: Set the vertical alignment of the content.
char: Set the alignment of content inside <thead> tag to a character.
charoff: It is used to set the characters the content inside the <thead> tag aligned from the character specified by the char attribute.

Example: Below HTML code demonstrates how to access the <tbody> element.

HTML

<!DOCTYPE html>
<html>
 
<head>
    <style>
        table,
        th,
        td {
            border: 1px solid green;
        }
    </style>
</head>
 
<body>
    <center>
        <h1>GeeksforGeeks</h1>
 
        <h2>HTML DOM TBody Object </h2>
 
        <table>
            <tbody id="tbodyID" align="left">
                <tr>
                    <td>Shashank</td>
                    <td>@shashankla</td>
                </tr>
                <tr>
                    <td>GeeksforGeeks</td>
                    <td>@geeks</td>
                </tr>
            </tbody>
        </table>
 
         
 
<p>
            Click on the button to get 
            the Tbody alignment.
        </p>
 
 
 
        <button onclick="btnclick()">
            Click here
        </button>
 
        <p id="paraID"></p>
 
 
    </center>
 
    <script>
        function btnclick() {
            var tbody = document
                .getElementById("tbodyID").align;
            document.getElementById(
                "paraID").innerHTML = tbody;
        }
    </script>
</body>
 
</html>

Output:

Syntax: Syntax for creating a <tbody> object

document.createElement("TBODY");

Example: Below HTML code illustrates how to create a <tbody> object.

HTML

<!DOCTYPE html>
<html>
 
<head>
    <style>
        table,
        th,
        td {
            border: 1px solid green;
        }
    </style>
</head>
 
<body>
    <center>
        <h1>GeeksforGeeks</h1>
 
        <h2>HTML DOM tbody object</h2>
 
        <table id="tableID">
 
        </table>
 
         
 
<p>
            Click button to create table element.
        </p>
 
 
 
        <button onclick="btnclick()">
            Click here
        </button>
    </center>
 
    <script>
        function btnclick() {
 
            /* Create tbody element */
            var x = document.createElement("TBODY");
             
            /* Create tr element */
            var y = document.createElement("TR");
             
            /* Create td element */
            var z = document.createElement("TD");
            z.innerHTML = "Manas Chhabra";
             
            /* Create td element */
            var w = document.createElement("TD");
            w.innerHTML = "@manas_coolguy";
            y.appendChild(z);
            y.appendChild(w);
            x.appendChild(y);
            document.getElementById("tableID").appendChild(x);
        }
    </script>
</body>
 
</html>