如何使用javascript隐藏表的单元格

How can I hide a cell of a table with javascript

本文关键字：单元格 隐藏 何使用 javascript      更新时间：2023-09-26

我想将如下所示的数据放入 Cell（2） 中，但隐藏且仅使用纯 JS

for(var i = 0;  i < obj.features.length; i++) {
    var featureTitle = obj.features[i].properties.title;
    var featureHab = obj.features[i].properties.Broad_Habi;
    var table = document.getElementById("myTableData");
    var rowCount = table.rows.length;
    var row = table.insertRow(rowCount);
    row.insertCell(0).innerHTML= '<a href="#" class="myButtonView" onClick="Javacsript:deleteRow(this)">?</a>';
    row.insertCell(1).innerHTML= '<a href="#" class="myButtonDelete" onClick="Javacsript:deleteRow(this)">X</a>';
    row.insertCell(2).innerHTML= featureTitle;
    row.insertCell(3).innerHTML= featureHab;
}

有多种解决方案可以解决这个问题

在 JavaScript 中，它就像使用 visibility-hidden 一样简单。

var tableCel = document.querySelector('td')[2];
tableCell.style.visibility = 'hidden';

如果以后要显示表单元格，只需更改属性的值即可。

tableCell.style.visibility = 'visible';

在jQuery中，有几种方法

$("td:eq(2)").hide();

或

$("td:eq(2)").css({ "visibility": "hidden" });

我想你想在点击删除行时隐藏，这可能是可能的

function deleteRow(rowyouwanttohide)
{
    rowyouwanttohide.style.visibility = 'hidden'; 
    //or you can go to display none like below
    rowyouwanttohide.style.display= 'none'; 
}
相关文章：