Javascript 动态删除html表中的多列_Javascript_Html

Javascript 动态删除html表中的多列

javascript html

Javascript 动态删除html表中的多列,javascript,html,Javascript,Html,我正在尝试使用javascript从html表中删除多个列。它使用的逻辑是，它在顶行中搜索标记“”，然后删除该列问题是，如果顶行中只有一个单元格有“”，那么它会很好地删除该列，但如果有多个列，则会抛出错误这是我的密码 <!DOCTYPE html> <html> <body> <table style="width:100%" border='1' id='Just_for_california'> <tr> <

我正在尝试使用javascript从html表中删除多个列。它使用的逻辑是，它在顶行中搜索标记“”，然后删除该列

问题是，如果顶行中只有一个单元格有“”，那么它会很好地删除该列，但如果有多个列，则会抛出错误

这是我的密码

<!DOCTYPE html>
<html>
<body>
<table style="width:100%" border='1' id='Just_for_california'>
  <tr>
    <td><span></span></td>
    <td>S</td>      
    <td><span></span></td>
  </tr>
  <tr>
    <td>Eve</td>
    <td>Jackson</td>        
    <td>94</td>
  </tr>
  <tr>
    <td>John</td>
    <td>Doe</td>        
    <td>80</td>
  </tr>
</table>

</body>


<script>



    var dataTable_length = document.getElementById('Just_for_california').rows[0].cells.length;
    var count_rows = document.getElementById('Just_for_california').rows.length;
    var column_array = [];
    for(var i=0; i<dataTable_length; i++)
    {
        var str = document.getElementById("Just_for_california").rows[0].cells[i].innerHTML;
        if(str.search("<span></span>") != -1)
        {
            column_array.push(i);
        }

    }
    var len = column_array.length;
    for(var i=count_rows-1 ; i>=0;i--)
    {
        rows_number = document.getElementById('Just_for_california').rows[i];
        console.log("row_number:"+i);

            for(var j=0; j<len;j++)
            {
                rows_number.deleteCell(column_array[j]);
            }

    }




</script>
</html>


s
前夕
杰克逊
94
约翰
雌鹿
80
var dataTable_length=document.getElementById（'Just_代表_california'）。行[0]。cells.length；
var count_rows=document.getElementById（'Just_代表_california'）。rows.length；
var列_数组=[]；
对于（变量i=0；i=0；i--）
{
rows_number=document.getElementById（'Just_代表_california'）。rows[i]；
控制台日志（“行号：+i”）；
对于（var j=0；j而言，之所以会发生这种情况，是因为在删除单元格时计算索引不正确。我对您的代码进行了重构（使其更清晰），现在它似乎可以工作了：
var table = document.getElementById('Just_for_california'),
    rows = table.rows;

for (var i = 0; i < rows[0].cells.length; i++) {
    var str = rows[0].cells[i].innerHTML;
    if (str.search("<span></span>") != -1) {
        for (var j = 0; j < rows.length; j++) {
            rows[j].deleteCell(i);
        }
    }
}

var table=document.getElementById（'Just_代表_california'），
行=表。行；
对于（var i=0；i<行[0]。cells.length；i++）{
var str=行[0]。单元格[i]。innerHTML；
如果（str.search（“”）=-1）{
对于（var j=0；j

问题是您试图“水平”删除单元格在行中。假设您要删除索引1
和3
处的单元格，表中有4列。当您删除第一个单元格1
时，它可以正常工作。但是，然后您移到右侧，尝试删除索引3
处的单元格。这会失败，因为您已经删除了单元格1
不再是索引为3
的单元格。现在的最大索引为2
。因此出现错误
在我改进的代码中，我将“垂直”删除列，所以这样的问题不会发生
演示：它会引发什么错误？您使用的是jQuery还是纯JS？添加了整个代码。谢谢dfsq。但这里还有另一个问题。如果我们使用colspan或rowspan，情况会完全改变。有什么建议吗？bdw。您的代码真的很有效。也许是的，colspan可能会让一切变得更有趣。如果您有这种情况下，我认为值得单独提问，因为它可能是非常详细的解决方案（或者可能不是，还不确定）。