HTML DOM Column 对象
HTML DOM Column对象
简介
HTML DOM Column 对象是指在HTML中Table中的Column。每一列由HTMLTableColElement 对象表示。Column 对象的主要作用是为了访问和操作HTML表格中的列。
使用方法
使用Column对象主要是通过获取HTMLTableColElement对象,通过它来操作Column。
获取Column对象
获取HTMLTableColElement 对象可以使用下列两种方式:
- 通过HTML元素ID获取:
var x = document.getElementById("myCol");
var table = x.parentNode.parentNode.parentNode; // 获取父类table对象。
var colIndex = x.cellIndex; // 获取Table中列索引。
var rows = table.getElementsByTagName("tr");
for (var i=0; i<rows.length; i++) {
var currentCell = rows[i].getElementsByTagName("td")[colIndex];
}
- 直接获取Table中column对象:
var col = myTableElement.column[index];
它们都是返回 HTMLTableColElement 对象。获取HTMLTableColElement对象后,就可以使用HTMLTableColElement的属性和方法。
Column 属性
列对象有下面列出的属性:
- width: 返回或设置列的宽度。
- span: 返回或设置列组中列的数量。
- align: 返回或设置列中内容的水平对齐方式 (left、right 或 center)。
- ch: 返回或设置列中内容的对齐字符。
- chOff: 返回或设置列中内容的对齐字符偏移量。
- vAlign: 返回或设置列中内容的垂直对齐方式 (top、middle 或 bottom)。
Column 方法
- createCaption(): 在表格中创建一个新的脚注。
- deleteCaption(): 从表格中删除脚注。
- createTHead(): 在表格中创建一个新的标题部分。
- deleteTHead(): 从表格中删除标题部分。
- createTFoot(): 在表格中创建一个新的页脚部分。
- deleteTFoot(): 从表格中删除页脚部分。
- insertRow(index):在指定列的下一行插入新行。
- deleteRow(index):从表格中删除行。
注意事项
- HTML DOM Column 对象不能直接用于修改表格的内容。对表格中内容的修改需要通过修改
标签(Cell)进行操作。 结语
HTML DOM Column 对象主要是为了访问和操作HTML表格中的列。通过获取HTMLTableColElement 对象,就可以使用 HTMLTableColElement 的属性和方法。除此之外,还需要注意使用上述属性和方法时的注意事项。