Table 對象
定義和用法
rules 屬性可設定或傳回表格的内部邊線。
文法
設定 rules 屬性:
tableObject.rules="none|groups|rows|cols|all"
傳回 rules 屬性:
tableObject.rules
值 | 描述 |
---|---|
none | 沒有内部邊界 |
groups | 顯示行組和列組之間的内部邊界 |
rows | 顯示内部行之間的邊界 |
cols | 顯示的列之間内部邊界 |
all | 顯示行和列之間的内邊界 |
浏覽器支援

所有主要浏覽器都支援 rules 屬性
注意:IE9可以正确顯示此屬性。早期版本的IE
除了内部四個邊界外,還會添加四個外邊界。
Chrome 和 Safari 可以正确顯示此屬性: 除了内邊框外還會影響外邊框。
執行個體
下面的例子設定了表格的兩種不同的内部邊線:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>菜鳥教程(runoob.com)</title>
<script>
function rows(){
document.getElementById('myTable').rules="rows";
}
function cols(){
document.getElementById('myTable').rules="cols";
</script>
</head>
<body>
<table id="myTable">
<tr>
<td>cell 1</td>
<td>cell 2</td>
</tr>
<td>cell 3</td>
<td>cell 4</td>
</table>
<br>
<button type="button" onclick="rows()">隻顯示行邊界</button>
<button type="button" onclick="cols()">隻顯示列邊界</button>
<p><b>注意:</b> rules屬性在Internet Explorer 9之前版本不能正常顯示。</p>
</body>
</html>
Table 對象