jquery - 使用 jquery 隐藏表的列/td

标签 jquery html css

如何使用jquery隐藏表格的列

< table >
  < tr >
   < td id="td_1" >name</ td >
   < td id="td_2" >title</ td >
   < td id="td_3" >desc</ td >
  </ tr >
  < tr >
   < td id="td_1" >Dave</ td >
   < td id="td_2" >WEB DEV</ td >
   < td id="td_3" >Blah Blah</ td >
  < /tr >
  < tr >
   < td id="td_1" >Nick< /td >
   < td id="td_2" >SEO< /td >
   < td id="td_3" >Blah Blah and blah< /td >
  < /tr >
< /table >

假设有人想隐藏所有行的第一列,即 td_1,那么代码是什么?

提前致谢 戴夫

最佳答案

$(document).ready(function() {
    $("#td_1").hide();
});

但理想情况下,您希望使用类而不是 ID。

所以

<table>
  <tr>
   <td class="td_1">name</td>
   <td class="td_2">title</td>
   <td class="td_3">desc</td>
  </tr>
  <tr>
   <td class="td_1">Dave</td>
   <td class="td_2">WEB DEV</td>
   <td class="td_3">Blah Blah</td>
  </tr>
  <tr>
   <td class="td_1">Nick</td>
   <td class="td_2">SEO</td>
   <td class="td_3">Blah Blah and blah</td>
  </tr>
</table>

然后您将使用类似的代码:

$(document).ready(function() {
    $(".td_1").hide()
});

所以唯一改变的是散列 (#) 变成了点 (.)。散列用于 ID,点用于类。

另一种方法是使用 nthChild选择器。

$(document).ready(function() {
    $('tr td:nth-child(1)').hide();
});

其中 1 是要隐藏的列号。

HTH

关于jquery - 使用 jquery 隐藏表的列/td,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/3296495/

相关文章:

javascript - 如果用户调整窗口大小/窗口未最大化,是否可以隐藏网页上的图像

html - 如何在 HTML 中将文本与图像中心垂直对齐?

javascript - 替代 getElementsByTagName

javascript - 在 jQuery 中从数组动态创建参数

javascript - 复选框值 0 或 1

javascript - 添加 CSS 样式已阻止 javascript 函数工作

javascript - 我有一个带有 onClick 处理程序的 div,还有带有 onClick 事件的按钮。如何防止按钮触发 div onclick?

css - 菜单和标题

html - 将屏幕分成 1 顶行和 2 列。两列应该是浏览器的 100% 高度

jquery - DOM 元素在位置 :absolute 时不显示