js设置table列得隐藏与显示

原版：

可以使用JavaScript来通过ID隐藏或显示表格的特定列。

首先，需要获取到包含该表格的HTML元素对象。然后，根据所选列的索引值（从0开始计数），设置相应单元格的CSS样式属性为"display: none;"来隐藏该列，或者将其设置为默认的CSS样式属性来显示该列。

下面是一段示例代码：

javascript// 获取表格元素
var table = document.getElementById("myTable"); // "myTable"是表格的ID

// 获取第2列（索引值为1）的所有单元格
var cellsInColumn = table.getElementsByTagName('td');
for (var i = 0; i < cellsInColumn.length; i++) {
if (i % table.rows[0].cells.length === 1) { // 判断当前单元格在第二列中
cellsInColumn[i].style.display = 'none'; // 隐藏该单元格
} else {
cellsInColumn[i].removeAttribute('style'); // 移除任何已存在的CSS样式属性，以便重新显示该单元格
}
}

注意事项：

• 上述代码假设表格只有一行标题行，并且每一列都有相同数量的单元格。如果表格结构不符合这些条件，则需要进行修改。
• 此处提供了基本的思路，具体实现还需要根据页面的DOM结构和需求进行调整。

整理后版本：

效果+代码：

<li>
            <label>隐藏/显示：</label> 
            <input type="checkbox" name="option1" value="0" οnclick="selectAll(this)">车型</input>
            <input type="checkbox" name="option1" value="1" οnclick="selectAll(this)">大众零件号</input>
            <input type="checkbox" name="option1" value="2" οnclick="selectAll(this)">车辆底盘号</input>
            <input type="checkbox" name="option1" value="3" οnclick="selectAll(this)">行驶里程</input>
            <input type="checkbox" name="option1" value="4" οnclick="selectAll(this)">供应商收件日期</input>

</li>

//隐藏显示列
    function selectAll(optionValue) {
        //获取点击选项值
        var lieZhi = optionValue.value;
        
        // 获取表格元素
        var table = document.getElementById("contentTable"); // "myTable"是表格的ID

        // 获取表头单元格并隐藏第二列
        var headerCells = table.getElementsByTagName('th');

        // 获取选中列得style
        var displayStyleq = headerCells[lieZhi].style.display;

        if (displayStyleq == 'none') {
            headerCells[lieZhi].style.display = ''; //显示表头
        } else if (displayStyleq == '') {
            headerCells[lieZhi].style.display = 'none'; // 假设第二列索引为1//隐藏表头
        }

        // 获取第2列（索引值为1）的所有单元格
        var cellsInColumn = table.getElementsByTagName('td');
        for (var i = 0; i < cellsInColumn.length; i++) {
            if (i % table.rows[0].cells.length == lieZhi) { // 判断当前单元格在第二列中
            
                var displayStyleq = cellsInColumn[i].style.display;

                if (displayStyleq == 'none') {
                    cellsInColumn[i].style.display = ''; // 显示该单元格
                } else if (displayStyleq == '') {
                    cellsInColumn[i].style.display = 'none'; // 隐藏该单元格
                }

            } 
        
        }

    }