如何使用 Javascript 隐藏表头

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/16031651/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-27 02:59:20  来源:igfitidea点击:

How to hide a Table Header using Javascript

javascriptjquery-uijquery-easyui

提问by Basha

How to hide table headers in javascript.

如何在 javascript 中隐藏表头。

In detail am using easyui-datagrid in which i have to hide the column header.

详细地使用easyui-datagrid,我必须在其中隐藏列标题。

Please guide me to fix this.

请指导我解决这个问题。

Thanks in advance.

提前致谢。

回答by whirmill

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:

如果您在没有任何框架(如 jQuery 等)帮助的情况下使用纯 javascript,您应该为您的表提供一个 id 并将表对象分配给一个变量:

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

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

然后找到表格里面的“thead”标签并隐藏,如下:

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.

请注意,getElementsByTagName 返回一个 html 元素数组,因为一个有效的表格可以有 0 或 1 个“thead”出现,如果您确定您的表格有标题,您可以安全地访问第一个元素并更改它的可见性。

回答by Francisco Corrales Morales

I did it with this code:

我用这个代码做到了:

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

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

You can also remove other elements, like the pagination-bar like this:

您还可以删除其他元素,例如像这样的分页栏:

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

回答by u1917467

The following code worked me :

以下代码对我有用:

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

回答by Kieron

If you really need to use JavaScript, then you should be able to use standard selectors and jQuery and use the Hide method:

如果您确实需要使用 JavaScript,那么您应该能够使用标准选择器和 jQuery 并使用 Hide 方法:

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

But I'd recommend using CSS instead:

但我建议改用 CSS:

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

It's lower impact using the CSS route, and all the jQuery will do it apply the same style directly to the element.

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