HTML DOM insertCell() 方法

定义和用法

insertCell() 方法用于在 HTML 表的一行的指定位置插入一个空的 <td> 元素。

语法

  1. tablerowObject.insertCell(index)

返回值

一个 TableCell 对象,表示新创建并被插入的 <td> 元素。

说明

该方法将创建一个新的 <td> 元素,把它插入行中指定的位置。新单元格将被插入当前位于 index 指定位置的表元之前。如果 index 等于行中的单元格数,则新单元格被附加在行的末尾。

请注意,该方法只能插入 <td> 数据表元。若需要给行添加头表元,必须用 Document.createElement() 方法和 Node.insertBefore() 方法(或相关的方法)创建并插入一个 <th> 元素。

抛出

若参数 index 小于 0 或大于等于行中的的表元数,该方法将抛出代码为 INDEX_SIZE_ERR 的 DOMException 异常

实例

下面的例子在表格行中插入了一个单元格:

  1. <html>
  2. <head>
  3. <script type="text/javascript">
  4. function insCell()
  5. {
  6. var x=document.getElementById('tr2').insertCell(0)
  7. x.innerHTML="John"
  8. }
  9. </script>
  10. </head>
  11. <body>
  12.  
  13. <table border="1">
  14. <tr id="tr1">
  15. <th>Firstname</th>
  16. <th>Lastname</th>
  17. </tr>
  18. <tr id="tr2">
  19. <td>Peter</td>
  20. <td>Griffin</td>
  21. </tr>
  22. </table>
  23. <br />
  24. <input type="button" onclick="insCell()" value="Insert cell">
  25.  
  26. </body>
  27. </html>