javascript - 如何使用 Javascript 隐藏表头

Question

如何在 javascript 中隐藏表头。

具体来说，我使用的是easyui-datagrid，我必须在其中隐藏列标题。

请指导我解决这个问题。

提前致谢。

Answer 1

If you use pure javascript without the help of any framework, like jQuery etc, you should give an id to your table and assign the table object to a variable:

var tb = document.getElementById("your-table-id");

and then find the "thead" tag inside the table and hide it, as follows:

tb.getElementsByTagName("thead")[0].style.display = "none";

note that getElementsByTagName returns an array of html elements, since a valid table can have 0 or 1 "thead" occurrencies, if you are sure that your table has headers you can securely access the first element and change it's visibility.

Answer 2

如果你真的需要使用 JavaScript，那么你应该能够使用标准选择器和 jQuery 并使用 Hide 方法：

$("#id or .class of header row").hide();

但我建议改用 CSS：

#id or .class of header row {
    display: none;
}

使用 CSS 路由的影响较小，所有 jQuery 都会将相同的样式直接应用于元素。

Answer 3

我用这段代码做到了：

 $('#my-ddata-grid').datagrid({
 ....
 ....
 });

jQuery('.datagrid-header-inner').hide();

您还可以删除其他元素，例如这样的分页栏：

jQuery('.datagrid-pager.pagination').remove();

Answer 4

以下代码对我有用：

<style>
.datagrid-header-row {
    visibility: collapse;
}
</style>