为单元格设置colspan/rowspan

war*_*iuc 9 html javascript html5 html-table

我有一个表,我想在运行时更改单元格的colspan/ rowspan属性.这是一个例子:

<html>
    <head>
        <script type="text/javascript">
            function setColSpan() {
                document.getElementById('myTable').rows[0].cells[0].colSpan = 2
            }
        </script>
    </head>

    <body>
        <table id="myTable" border="1">
            <tr>
                <td>cell 1</td>
                <td>cell 2</td>
            </tr>
            <tr>
                <td>cell 3</td>
                <td>cell 4</td>
            </tr>
        </table>
        <form>
            <input type="button" onclick="setColSpan()" value="Change colspan">
        </form>
    </body>

</html>
Run Code Online (Sandbox Code Playgroud)

我的问题是细胞移位了.我是否应该移除有问题细胞跨越的细胞?

我可以不删除吗?

我想实现一个简单的电子表格.现在,我设法能够选择一个矩形范围的单元格,并显示一个带有"合并选定单元格"选项的菜单.我希望能够"取消合并"细胞,所以跨越细胞而不必移除其他细胞是很好的.

999*_*99k 21

我想你需要删除单元格.请检查以下代码.我做了什么删除了整行,并添加了新的列跨度新行

function setColSpan() {
    var table = document.getElementById('myTable');
    table.deleteRow(0);
    var row = table.insertRow(0);
    var cell = row.insertCell(0);
    cell.innerHTML= "cell 1"
    cell.colSpan = 2
}
Run Code Online (Sandbox Code Playgroud)