javascript对table的DOM操作-优快云博客

本文详细介绍了HTML中Table、TableRow及TableCell三个对象的属性与方法，包括如何通过这些对象进行表格的创建、修改和删除等操作。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

[color=indigo][b]一、Table对象[/b][/color]
[b]DOM继承关系：Node —— Element —— HTMLElement —— Table[/b]

[b]1、Table对象的属性：[/b][color=red]
.rows [/color][color=blue]//[/color][color=green]返回一个数组，存放所有的行对象，即TableRow对象[/color]
除了这个属性之外，其它的就是<table>标记中的属性

[b]2、Table对象的方法：[/b]
[color=red].insertRow( index )[/color] [color=blue]//[/color][color=green]插入一行，返回新插入的TableRow对象[/color]
[color=red].deleteRow( index )[/color] [color=blue]//[/color][color=green]删除一行[/color]

[color=indigo][b]二、TableRow对象[/b][/color]
[b]DOM继承关系：Node —— Element —— HTMLElement —— TableRow[/b]

[b]1、TableRow对象的属性：[/b]
[color=red].cells [/color][color=blue]//[/color][color=green]返回存放所有单元格的数组，即元素是TableCell对象[/color]
[color=red].rowIndex [/color] [color=blue]//[/color][color=green]返回该行所在表中的位置[/color]
除了这两个属性外，其它的就是<tr>标记中的属性

[b]2、TableRow的方法[/b]
[color=red].insertCell( index )[/color] [color=blue]//[/color][color=green]在指定位置插入一个单元格，返回被插入的单元格（TableCell）对象[/color]
[color=red].deleteCell( index )[/color] [color=blue]//[/color][color=green]删除一个单元格[/color]

[color=indigo][b]三、TableCell对象[/b][/color]
[b]DOM继承关系：Node —— Element —— HTMLElement —— TableCell[/b]

[b]1、TableCell对象的属性[/b]
[color=red].cellIndex [/color][color=blue]//[/color][color=green]返回它在行中的位置[/color]
除了这个属性之外，其它的就是<td>标记中的属性

[color=brown]注：这三个对象除了本身所具有的属性和方法之外，还继承了它们的上面的三个父类的属性和方法，继承的这些属性和方法是DOM的核心，具体可查看我的文章[url]http://han2000lei.iteye.com/admin/blogs/518083[/url][/color]