当试图隐藏表中的行时jQuery性能

我有性能问题。例如，我有一个500行的表，我试图隐藏它的列，并花费在等待10秒左右。当试图隐藏表中的行时jQuery性能

<table> 
<thead> 
<th class="c1">ColumnName1</th> 
<th class="c2">ColumnName2</th> 
</thead> 
<tbody> 
<td class="c1">data</td> 
<td class="c2">data</td> 
</tbody> 
</table>

我使用不便像

jQuery('.c2').hide();

任何人都可以给我建议如何提高速度这一问题。

谢谢！

来源

2012-02-09 Ishikawa Yoshi

需要多长时间50行？ – ManseUK 2012-02-09 10:38:19

我测试它在铬，50行hm ... <1秒 – 2012-02-09 10:44:38

第一jQuery的DOM遍历更快，当你指定id元素

$("#myTable .c2").hide();

或添加背景

$('.class', '#class-container').hide();

来源

2012-02-09 10:38:06

五百行是相当多的，让我明白了，你可能会在运行一些性能问题。您可以尝试提供更具体的选择器开始。试试这个，例如：

jQuery('td.c2').hide();

或添加ID到你的餐桌，使之更加具体

jQuery('#yourTableId td.c2').hide();

您也可能会发现这篇关于jQuery选择性能非常有用：

jQuery Performance Rules

基于什么是ING在那篇文章中说，你很可能是最好做这样的事情的：

jQuery("#yourTableId").find("td.c2").hide(); 

// Or if you intend to do more than one operation on your set of elements, 
// cache the set of elements in a variable, so that the selector is only run once 

var myElements = jQuery("#yourTableId").find("td.c2"); 
myElements.hide(); 
myElements.remove(); // Do some other stuff to your elements 

// Or make use of the chaining 
jQuery("#yourTableId").find("td.c2").hide().remove();

来源

2012-02-09 10:39:05

Thanx，我尝试现在使用它，之后，我说结果。 – 2012-02-09 10:58:34

我认为这将是更多的更快，如果你首先由ID选择表，然后使用.find（）。选择表格将为搜索设置一个上下文，而不是遍历整个文档。

您也可以在按类选择时预先标记tagName。

$("#myTable").find('td.c2')

来源

2012-02-09 10:39:27

您可以使用更有效的选择器。例如，将一个id放在你的表上，并按照每一行进行搜索，以得到类c2的td。

jQuery("#table_id > tr > td.c2").hide();

使用选择器“>”告诉jQuery选择直接子元素，而不是搜索父元素中的所有标签。

来源

2012-02-09 10:41:45

它实际上取决于不同的东西，比如：

您正在使用测试浏览器（Internet Explorer 7和8是在渲染方面和JS引擎总体上比Chrome和Mozilla的慢得多）
HTML的需要隐藏的每一列

你或许应该考虑解决对服务器的SID这个问题金额e（如果您使用的是ASP，JSP，PHP等）并发回操纵的HTML。现在人们认为所有事情都可以用纯JavaScript来处理。尽管现代网络浏览器变得越来越快，但仍然存在使用“传统”服务器端网页开发方式的情况。

的另一件事情（只是东西给你测试）：我想谈谈也许你可以尝试使用visibility: collapse代替display: none （被调用hide()时使用jQuery的

来源

2012-02-09 10:50:57 Chris

这又是我。）我如何决定这个问题
我需要提高性能，而我与合流和我的工作。
在这个动作中，我生成带有html代码的json，然后将其发送回此代码是表格的三角形取决于过滤器参数。而且我也使用confluence缓存的优点。最后的perfomanse结果小于100ms。 Bingo）） Thnx全部用于回复

p.s. 2Christofer Eliasson 我尝试使用性能规则，但它不会提高性能，但无论如何感谢有用的链接。我会尽量在将来使用这个良好的做法）

来源

2012-03-02 07:41:22

当试图隐藏表中的行时jQuery性能

回答

相关问题