Javascript 搜索筛选器是否应使用getElementsByClassName？

我有115个分区是120x120，每个分区都有不同的背景图像。每个div都有多个类名，我使用

getElementsByClassName

仅用于搜索栏。例如，假设有115个人，但如果能够在搜索中写下“女性”，则会隐藏所有男性，只显示女性

---

这是执行搜索筛选的错误方法吗？我将div设置为

display=“none”

以隐藏它们，如果它们是正在搜索的内容的一部分，则设置为

block

。我只是担心使用多个空类名作为搜索过滤器。这样做可以吗？还是有一种更方便的方法专门针对这样的事情？我认为这是一种巧妙的方法，但这要视情况而定。它将保留115个“项目”，还是你打算增加更多？因为如果你打算增加更多，它可能无法很好地扩展。我认为这已经太多了，不是因为搜索方法本身，而是因为你有100个隐藏的div，背景图像占用了所有的浏览器资源

---

您可以将项目存储在数据库表中，其中包含一个用于背景图像路径的字段和一个用于关键字的字段，当您执行搜索并仅显示具有匹配关键字的项目时，而不是隐藏所有不具有匹配关键字的项目。

您可以使用更基于数据的方法（我的意思是，它们都是基于数据的……比方说它更像一个数据库）通过在JavaScript中保留115条记录的数组。实际上，您有一个平面文件数据库。如果您的JavaScript技能擅长于此，那么使用生成div而不是隐藏div的方法将非常方便——这将解决Campari提到的资源问题

---

它实际上比您当前的解决方案更具可扩展性。首先，您可以将阵列保存在单独的

.js

或

.ini

文档中，以便于维护。

当然，通常的解决方案使用带有脚本的数据库来应用查询。我认为您有一个有趣的选择。我不知道如何进一步评论呃，除了要指出的是，与数据库方法相比，它可能很难扩展，或者应用于未来的需要。换句话说，答案取决于你未来的计划，至少部分取决于你的计划。感谢你的帮助！这是一个相当小的项目。就像，一旦完成了，它就完成了。我不会不断地向它添加内容。我从来没有使用过imagiNE超过150 DIV，它永远不会发生。所以你会觉得它不够大，担心它的方式吗？再次感谢你的帮助你提到数据库。除非你想要一个大的学习项目，考虑一个轻量级的程序，像更多。非常感谢你花时间回答。即使我使用的数据库不我必须使用

display=“block”隐藏所有的

每次，这样它就可以显示正在搜索的少数几个？否则它如何隐藏正在显示的、当前正在被过滤掉的那些？讨厌名字——通常的方法是根据需要生成div，而不是隐藏它们。@HateNames我强烈建议不要这样做。假设一开始它显示所有div。然后，如果您进行搜索，它将指定div，您可以删除它们以减轻浏览器的负担。然后“生成”如果需要的话，可以用JavaScript再次访问它们。@Smandoli--我知道了，我目前正在研究数据库，以获得这方面的更多知识。但我必须问一下，生成115不是也一样糟糕吗？我的意思是，假设一个人搜索一个名字，完全删除它，搜索另一个名字，等等数次。每次他们都会删除整个搜索过滤器，它必须重新生成所有115个才能显示，对吗？在开始时加载它们，然后将其隐藏，这不是会降低浏览器的总体负载吗？抱歉，所有的问题，我只是很想了解更多。再次感谢您的帮助help@Campari--和我上面提到的一样，是不是去掉了很多的，然后加上一个更大的load不仅仅是将display设置为block和none？据我所知，display none告诉浏览器完全忽略所述元素，因此它甚至不应该占用这些元素的资源？对我来说，这样做很容易，因为我已经准备好了代码，只需删除CHILD而不是将display设置为none。但随着我意识到在另一条评论中，你们确定不停地删除和重新生成而不只是将“显示”设置为“无”会减少浏览器的负载吗？非常感谢你们的帮助，很抱歉打扰一下。问题是是否呈现div。你们可能想使用浏览器工具来查看资源是如何处理的（例如，Firebug）。感谢您一直以来提供的帮助，甚至包括一个我可以测试资源的工具。尽管我知道，但不用问就可以告诉我各种提示仍然很好。再次感谢您的帮助您非常有礼貌，这是一种荣幸。关于Firebug之类的--我发现它们很难理解，主要是因为ting太深了。坚持下去——好处是巨大的。