DOM Manipulation Table--html DOM

HTML CREATE TABLE:

<table berder= ' 1 ' width= ' >    <thead>        <tr>            <th> name </th>            <th> Gender </th>             <th> age </th>         </tr>    </thead>    <tbody>         <tr>             <th>tzr</th>            <th> men </th>             <th>24</th>         </tr>         </tr>    </tbody>    <tfoot>        <tr>            <th> end </th>        </tr >    </tfoot>   

Instead, the DOM is created by:

window.onload=function() {    var table=document.createelement (' table ');    Table.width=300;    Table.border=1;}

Use the AppendChild () method to add a table's THEAD, tr,th. Such as:

var thead=document.createelement (' thead '); Table.appendchild (thead);

As you can see, creating tables using the DOM is tiring.

Here's a look at how to get tabular data using the DOM: get the contents of the first child node of table caption.

window.onload=function() {    var table=document.getelementbytagname (' table ') [0] ;    Alert (table.children[0].innerhtml);}

Therefore, we often use HTML DOM.

Table.caption.innerHTML;

Table.caption.innerhtml= ' Personnel table ';

Table.thead;

Table.tfoot;

Table.tbodies; Returns the Tbody collection

Table.rows; All TR Collections

Table.tbodies[0].rows; TR set of Principal tbody

table.tbodies[0].rows[1].cells[1].innerhtml; Returns the contents of the second cell in the second row of a body

Table.deletecaption ();

Table.deletethead ();

Table.tbodies[0].deleterow (0); Delete Body First row

Table.tbodies[0].rows[1].deletecell (1); Delete the second row of the body second data

Finally, we can create a table quickly and easily.

Table.createcaption (). innerhtml= ' Personnel table ';

var thead=table.createthead ();

var tr=thead.insertrow (0);

Tr.insertcell (0). innerhtml= ' Data 1 ';

Tr.insertcell (1). innerhtml= ' Data 2 ';

Tr.insertcell (2). innerhtml= ' Data 3 ';

PS:,<table>,<tbody>,<th> does not have a specific method when creating a table.

DOM Manipulation Table--html DOM