html的table标签用js做合并单元格操作

JavaScript027

html的table标签用js做合并单元格操作,第1张

为什么要用js呢？table本身就有合并单元格的功能，其实如果你用js也是给table添加对应的样式。具体代码如下：

<style>

table{ border-collapse:collapse}

table td{ border:2px solid #ddd width:50px height:25px text-align:center}

</style>

<table>

  <tr>

    <td colspan="2">123</td> //横向合并单元格

    <td>456</td>

    <td>789</td>

  </tr>

  <tr>

    <td rowspan="2">123</td> //竖向合并单元格

    <td>456</td>

    <td>456</td>

    <td>456</td>

  </tr>

  <tr>

    <td>123</td>

    <td>456</td>

    <td>456</td>

  </tr>

</table>

上了那个站点。但没找到你说的例子。

To51windows(海娃)、inelm(木野狐):

你们的例子都满足不了我的要求。

那个在线编辑器还可以，但操作不方便。而且没代码。另外在拆分单元格时有Bug.

Toawaysrain(绝对零度)：

你提供的代码正是我梦寐以求的。在简单方正的表格中进行测试完全没有问题。

但遗憾的是，在存在复杂的colSpan及rowSpan的表格中进行测试。该算法无法完成跨行的合并。

在完成跨列的单元格合并后，也未对影响范围内的其它单元格的rowSpan进行处理，这导致多次合并操作后表格错乱。

我自己的算法与该算法存在差不多相同的问题。

请各位大虾再提供些参考。感激不尽啊！