JavaScript library which can be used to simplify complex tables by splitting
merged cells.
Table cells which are merged by colspan
and rowspan
attributes will be
duplicated including cell content.
npm install complex-to-plain-table --save
var complexToPlainTable = require("complex-to-plain-table")
complexToPlainTable(document.querySelector('table'));
npm test
Table input:
<table>
<tr>
<td colspan="3">1</td>
<td>4</td>
<td rowspan="3">5</td>
</tr>
<tr>
<td>1</td>
<td rowspan="2">2</td>
<td>3</td>
<td>4</td>
</tr>
<tr>
<td rowspan="2">1</td>
<td>3</td>
<td>4</td>
</tr>
<tr>
<td colspan="3">2</td>
<td>5</td>
</tr>
<tr>
<td>1</td>
<td>2</td>
<td colspan="3">3</td>
</tr>
</table>
1 | 4 | 5 | ||
1 | 2 | 3 | 4 | |
1 | 3 | 4 | ||
2 | 5 | |||
1 | 2 | 3 |
Table output:
<table>
<tbody>
<tr>
<td>1</td>
<td>1</td>
<td>1</td>
<td>4</td>
<td>5</td>
</tr>
<tr>
<td>1</td>
<td>2</td>
<td>3</td>
<td>4</td>
<td>5</td>
</tr>
<tr>
<td>1</td>
<td>2</td>
<td>3</td>
<td>4</td>
<td>5</td>
</tr>
<tr>
<td>1</td>
<td>2</td>
<td>2</td>
<td>2</td>
<td>5</td>
</tr>
<tr>
<td>1</td>
<td>2</td>
<td>3</td>
<td>3</td>
<td>3</td>
</tr>
</tbody>
</table>
1 | 1 | 1 | 4 | 5 |
1 | 2 | 3 | 4 | 5 |
1 | 2 | 3 | 4 | 5 |
1 | 2 | 2 | 2 | 5 |
1 | 2 | 3 | 3 | 3 |
MIT