显示包含大量数据的弹出式容器的最佳方法

Question

因此，我正在开发一个网站（ASP.Net Core MVC），并且我试图显示一个容器，一旦单击“按钮”，便会看到其中包含大量数据。

每行都有其添加按钮。一页上一次只有大约10-30个按钮。单击该按钮后，所显示的弹出窗口应立即显示在单击的按钮旁边。如您在图片中看到的，弹出窗口本身可能包含很多数据。而且此数据可能与每一行都不同。

什么是最好的方法？

1. 将这些弹出窗口分别放置在HTML中，并在悬停时单击display: block和display: none。
2. 使用jQuery并使用append方法并召唤其旁边的弹出窗口，并将其悬停后将其删除。

或者还有其他方法吗？

我为什么要问？

我对性能和加载时间感到担忧。

Answer 1

我认为这两种方法都有缺点和优点。

对于方法1： 这将导致较慢的初始加载时间，但比加载方法2更快地使用。

方法2： 不利的一面是为此需要加载jQuery。我不知道您是否在整个项目中都使用它。只是为此，这会有点过分杀伤力。 但是，初始加载时间可能很快，您可以在单击每个数据时使用AJAX加载每个数据。

我不是一个有10年经验的程序员，所以这个答案纯属我的看法，也是我对此的看法。

希望这会引起讨论！