DOM แท็ก td
property
abbr
align
axis
cellIndex
className
colSpan
id
innerHTML
rowSpan
vAlign
width

abbr ข้อความชื่อย่อของแท็ก td
ตัวอย่าง
<table id="table1" border="1" width="200">
<tr><td id="td1" abbr="td 1">a</td></tr>
<tr><td id="td2">b</td></tr>
</table>

<script type="text/javascript">
alert(document.all.td1.abbr);
</script>

จากตัวอย่างจะแสดง dialog เป็นค่า abbr ของ td1



align รับหรือตั้งค่าการเรียงข้อมูลภายในแท็ก td
ตัวอย่าง
<script type="text/javascript">
function alignLeft()
{
document.all.td1.align="left";
document.all.td2.align="left";
}

function alignRight()
{
document.all.td1.align="right";
document.all.td2.align="right";
}
</script>

<table id="table1" border="1" width="200">
<tr><td id="td1" align="center">a</td></tr>
<tr><td id="td2" align="center">b</td></tr>
</table>
<input type="button" onclick="alignLeft()" value="Left"><br />
<input type="button" onclick="alignRight()" value="Right"><br />

ค่าที่เป็นไปได้คือ left | right | center
จากตัวอย่างจะกำหนดให้ชิดซ้ายหรือขวาตามการกดปุ่ม


axis ข้อความชื่อของแกนในแท็ก td
ตัวอย่าง
<table id="table1" border="1" width="200">
<tr><td id="td1" axis="column 1">a</td></tr>
<tr><td id="td2" axis="column 2">b</td></tr>
</table>

<script type="text/javascript">
alert(document.all.td1.axis);
</script>

จากตัวอย่างจะแสดง dialog เป็นค่า axis ของ td1


cellIndex ค่าตัวเลขบอกว่าเป็น column ที่เท่าไหร่
ตัวอย่าง
<table id="table1" border="1" width="200">
<tr><td id="td1">a</td></tr>
<tr><td id="td2">b</td></tr>
</table>

<script type="text/javascript">
alert(document.all.td1.cellIndex);
alert(document.all.td2.cellIndex);
</script>

จากตัวอย่างจะแสดง dialog เป็นค่า column ของ td1 และ td2 ตามลำดับเป็นค่า 0 และ 1


className รับหรือตั้งค่าของ class
ตัวอย่าง
<table id="table1" cellspacing="10" class="class1">
<caption>caption ของ table</caption>
<tr><td id="td1" class="classTD1">a</td></tr>
<tr><td>b</td></tr>
</table>

<script type="text/javascript">
document.write(document.all.td1.className);
</script>

จากตัวอย่างจะพิมพ์ค่าของ className


colSpan รับหรือตั้งค่าของ colspan
ตัวอย่าง
<script type="text/javascript">
function change()
{
document.all.td3.colSpan="2";
}
</script>

<table border="1">
<tr>
<td id="td1">a</th>
<td id="td2">b</th>
</tr>
<tr>
<td id="td3">c</td>
<td id="td4">d</td>
</tr>
</table>
<input type="button" onclick=change() value="change">

จากตัวอย่างจะเปลี่ยนค่าของ colSpan


id กำหนดหรือรับค่าid
ตัวอย่าง

<table border="1">
<tr>
<td id="td1">a</th>
<td id="td2">b</th>
</tr>
<tr>
<td id="td3">c</td>
<td id="td4">d</td>
</tr>
</table>

<script type="text/javascript">
document.write(document.all.td1.id);
</script>

จากตัวอย่างจะพิมพ์ข้อความว่า td1


innerHTML กำหนดหรือรับค่า HTML ภายในแท็ก tr
ตัวอย่าง

<table border="1">
<tr>
<td id="td1">a</th>
<td id="td2">b</th>
</tr>
<tr>
<td id="td3">c</td>
<td id="td4">d</td>
</tr>
</table>

<script type="text/javascript">
alert(document.all.td1.innerHTML);
</script>

จากตัวอย่างจะพิมพ์ข้อความภายในแท็ก td1คือ a


rowSpan รับหรือตั้งค่าของ rowspan
ตัวอย่าง
<script type="text/javascript">
function change()
{
document.all.td1.rowSpan="2";
}
</script>

<table border="1">
<tr>
<td id="td1">a</th>
<td id="td2">b</th>
</tr>
<tr>
<td id="td3">c</td>
<td id="td4">d</td>
</tr>
</table>
<input type="button" onclick=change() value="change">

จากตัวอย่างจะเปลี่ยนค่าของ rowSpan


vAlign กำหนดหรือรับค่าการจัดเรียงในแนวตั้ง
ตัวอย่าง

<script type="text/javascript">
function alignTop()
{
document.all.td1.vAlign="top";
document.all.td2.vAlign="top";
}

function alignBottom()
{
document.all.td1.vAlign="bottom";
document.all.td2.vAlign="bottom";
}
</script>

<table border="1">
<tr>
<td id="td1" height=100 width=100>a</th>
<td id="td2" height=100 width=100>b</th>
</tr>
<tr>
<td id="td3" valign=middle height=100 width=100>c</td>
<td id="td4" valign=middle height=100 width=100>d</td>
</tr>
</table>
<input type="button" onclick="alignTop()" value="alignTop"><br />
<input type="button" onclick="alignBottom()" value="alignBottom"><br />

ค่าที่เป็นไปได้คือ top | middle | bottom | baseline
จากตัวอย่างจะกำหนดให้ชิดบนหรือล่างตามการกดปุ่ม


colSpan รับหรือตั้งค่าของ colspan
ตัวอย่าง
<script type="text/javascript">
function change()
{
document.all.td3.width="200";
}
</script>

<table border="1">
<tr>
<td id="td1">a</th>
<td id="td2">b</th>
</tr>
<tr>
<td id="td3">c</td>
<td id="td4">d</td>
</tr>
</table>
<input type="button" onclick=change() value="change">

จากตัวอย่างจะเปลี่ยนค่าของ width



menu DOM