利用DOM處理表格及其子結構：
(1) 呼叫表格中的儲存格：要呼叫儲存格，程式碼的形式為：
表格物件.rows[列的序數].cells[儲存格的序數];
列的序數為由上到下排序，儲存格的序數為由左到右排序。如：
<table width="300" border="1" style="text-align:center" id="tt">
<tr height="30">
<td width="100">A</td><td width="100">B</td><td width="100">C</td>
</tr>
<tr height="30">
<td colspan="2">D</td><td>E</td>
</tr>
</table>
<input type="button" value="按我" onclick="
var tobj=document.getElementById('tt');
tobj.rows[0].cells[0].innerHTML='甲';
tobj.rows[0].cells[1].innerHTML='乙';
tobj.rows[0].cells[2].innerHTML='丙';
tobj.rows[1].cells[0].innerHTML='丁';
tobj.rows[1].cells[1].innerHTML='戊';
"/>
//執行後顯示：
//按下按鈕後顯示：
註：利用成員屬性length可以得知在表格中的列數、或在列中的儲存格數。如：
(2) 在表格中插入新的列或儲存格：程式碼的形式為：
表格物件.insertRow(列的序數); //插入列
表格物件.rows[列的序數].insertCell (儲存格的序數); //插入儲存格
註：若光有表格物件.insertRow(列的序數);是不夠的，那只會插入列而不會插入儲存格。承(1)中的程式碼範例：
<table width="300" border="1" style="text-align:center" id="tt">
<tr height="30">
<td width="100">A</td><td width="100">B</td><td width="100">C</td>
</tr>
<tr height="30">
<td colspan="2">D</td><td>E</td>
</tr>
</table>
<input type="button" value="按我" onclick="
var tobj=document.getElementById('tt');
tobj.insertRow(2);
tobj.rows[2].height='30';
tobj.rows[2].insertCell(0);tobj.rows[2].cells[0].innerHTML='F';
tobj.rows[2].insertCell(1);tobj.rows[2].cells[1].innerHTML='G';
tobj.rows[2].insertCell(2);tobj.rows[2].cells[2].innerHTML='H';
"/>
//執行並且按下按鈕後顯示：
(2) 在表格中刪除原有的列或儲存格：程式碼的形式為：
表格物件.deleteRow(列的序數); //插入列
表格物件.rows[列的序數].deleteCell (儲存格的序數); //插入儲存格
承(1)中的程式碼範例：
<table width="300" border="1" style="text-align:center" id="tt">
<tr height="30">
<td width="100">A</td><td width="100">B</td><td width="100">C</td>
</tr>
<tr height="30">
<td colspan="2">D</td><td>E</td>
</tr>
</table>
<input type="button" value="按我" onclick="
var tobj=document.getElementById('tt');
tobj.deleteRow(1);
tobj.rows[0].deleteCell(2);
"/>
//執行並且按下按鈕後顯示：
留言列表
javascript 教學 (1)
