隐藏/显示多达100个DOM元素的最有效方法是什么？

Question

假设您最多有100个元素，其类型和格式不会改变，但它们的上下文会改变。 （它们基本上是行）
这些行绑定到输入并随着用户键入而更改。

最佳性能的最佳方法是什么？重用这些元素，保持一切，但改变他们的背景？还有什么吗？

编辑，澄清：
搜索算法是无关的，但我确实使用MVVM（angularjs）框架，所以我正在进行的搜索是在JavaScript上，而不是瓶颈;获得结果后，我会相应更新。

此外，我不需要搜索DOM上的元素，我确实有元素的引用，我想在更新期间最小化运行时。

Answer 1

对于代码，这样做，

$(element).css('display' , 'none');

但性能问题取决于你如何找到这些元素， 关键是将元素包装到容器中，并仅搜索该容器中的元素：

$('container').find('your_elements').css('display' , 'none');

或

$('your_elements', 'container').css('display' , 'none');

会这样做。

永远不要：

$('your_elements').css('display' , 'none'); 

JS将不得不搜索整个dom

Answer 2

如果你只有100个元素，那真的不重要。只需设置其样式对象的display属性即可显示或隐藏它们。

Answer 3

使用所有行的唯一ID并使用jquery通过更改其值来操作它。

Answer 4

最好的方法是，将所有这些元素包装在div中并将样式设置为外部div（假设它们在一起，就像你说它们是行一样）

<div id="wrapper">
   <!-- Your dom elements -->
</div>

为你的包装div设置合适的样式。

通常我不认为我们需要担心这些事情的性能，因为它们是非常微不足道的操作。

Answer 5

我认为使用display none创建一个CSS类，并通过这样做将该类应用于TR元素，您将能够利用jquery选择器供以后使用。 $('TR.hidden') 和 if(!$('TD').hasClass('hidden'))