Javascript 关于Ajax成功重载表

我正在处理以下问题

我有一个应用程序，上面有一张桌子：

<table>
<tr>
   <th>bla</th>
   <th>bla</th>
   <th>bla</th>
</tr>
<?php foreach($bla as $b){ ?>
<tr>
   <tr><?=$b["bla"];?></tr>
   <tr><?=$b["bla"];?></tr>
   <tr><?=$b["bla"];?></tr>
</tr>
<?php }?>
</table>

所以我有这个表，它总是有一个标题和一些行，这取决于变量$bla。变量$bla来自一个db，它只读取我的db中一个表中的所有行

我现在想要实现的是一个搜索，因此有人可以在一个输入字段中输入他的搜索查询，然后再次执行SQL查询，其中包含一个LIKE来执行搜索，然后只显示包含搜索词的行。或者，我可以考虑简单地过滤我以前使用的数组，这样我就已经有了变量中的所有行，我可以简单地临时删除所有其他数组元素，这些元素不包含搜索的单词

现在有两个问题：你认为什么更有效？数据可能不会很快超过10000行，这只是一个衡量标准。总是在用户完成键入、在数据库中搜索并直接显示数据时查询数据库是更好还是过滤组成的数组更好

第二个问题：我如何实现这一点？我的意思是，数组过滤方法可能没有那么难，尽管我不确定如何过滤多维元素，因为db中的每一行都有第一级，db中的每一列都有第二级。编辑：还有：我会遇到与第二个db解决方案相同的问题：我如何在表中获得过滤数据，因为表也只加载了一次，需要一些javascript，就像第二个解决方案一样，我想

但是我认为从数据库中获取数据的方法有点难。我想到的是发送一个AJAX请求，一旦成功，我就可以交付搜索到的数组。但是：我怎样才能重新加载表呢？我肯定不想重新加载整个页面，我想要一种实时搜索，所以页面通常应该保持不变，只有表应该重新加载并显示从AJAX传递的变量的内容。我该怎么做？我的意思是，理论上我可以用AJAX发送数据到的PHP文件中的新数据回显整个foreach，然后将旧的foreach设置为display:none，并在下面使用一个新的div，并将display:block和作为html属性传递的数据赋予它，但这确实不优雅，我认为一定有更好的解决方案

---

有什么想法吗？

我建议您为此使用预构建JavaScript库。这是一种非常简单、可靠的方式，可以在表中显示数据，并具有许多功能，如搜索、分页等

---

只需列出表中的所有数据，并调用datatables jquery插件来完成其余的工作。如果需要，您还可以轻松实现服务器端处理。

看起来很有希望，您认为实现这一点需要付出很大的努力吗？我怎么开始呢？哦，好吧，那很简单，它已经开始工作了，谢谢你的提示！