jQuery性能问题

Question

我有一个性能问题，当我使用这个代码，但超过1000 <tr>行

这个想法是，我有标签<tr>，里面有文本td，我试图隐藏和显示文本是否包含。代码工作，但有超过1000个<tr>与信息我有很多延迟。有什么办法能让它快一点吗?这段代码在文本改变时被调用，因此被称为小于keypress(我想要的原始方式)

var grilla = $(control).parent().parent().next().next();
  var texto = $.trim($(control).val());

    if(texto.length < 2){
        grilla.children().children().children().children('tr').show(200);
        return false;
    }
    var renglones = grilla.children().children().children().children("tr");
    if($(renglones).children('td:first').children().is('[type=text]')){
        console.info('busca en inputs');
            buscarGrillaInputs(renglones,texto);
            return false;
    }
    $.each( renglones, function() {
        if (!$(this).children('td').is(':contains('+texto.toLowerCase()+')') && !$(this).children('td').is(':contains('+texto.toUpperCase()+')')){
            $(this).hide(200);
        }
        else{
            $(this).show(200);
        }
    });

Answer 1

我一度尝试使用contains选择器，发现性能非常慢。我用$.filter

比较好

而且。show(200)会伤害你。当有大量的条目需要运行时，只需运行。show()和。hide()

http://jsfiddle.net/SeanWessell/e7yvrta1/

$('#search').on('input propertychange paste', function () {
    var phrase = this.value;
    $('tr').hide();
    $('table input').filter(function () {
        return this.value.toLowerCase().indexOf(phrase) != -1;
    }).closest('tr').show();
});