使用 ajax 每秒刷新 div 并使用现有 div 显示新 div

Question

我有 1 个网页，我想在其中显示加入我的网站的用户列表以及他们之间的联系。

我有用户和他们之间的联系：

 var data=[
           {
              "Id": 38,
               "Connections":[39,40],
               "Name":"ABc"
          },
           {
              "Id": 39,
               "Connections":[40],
               "Name":"pqr"
           },
           {
               "Id": 40,
               "Connections":[],
               "Name":"lmn"
           }]

在上面的示例中，Id:38 的用户连接到user 39 and 40，而user 39 is connected to user 40 and user 40 已经连接到user 39 and user 38 so user 40 Connection array is blank。

我有一个网络服务，我将每 1-2 秒触发一次，以在此页面上显示新加入的用户以及我存储在我的表中的现有用户之间的新连接，此网络服务将获取所有用户及其连接.

所以一开始我的页面会加载，但之后我的页面不会刷新，并且应该显示新用户，并且新连接应该通过 AJAX 调用连接到我的 Web 服务。

到目前为止，我已经成功地显示了用户和他们之间的连接，但现在在 1-2 秒内卡住了自动刷新 div，以便在不建立以前的连接的情况下建立新的连接。

现在发生的事情是当我刷新我的 div 时，之前的连接再次建立。

我正在使用这个插件：Jquery-connections.js

这是我制作的一个演示；请忽略我保存在 html 中的 js，因为那是插件（Jquery-connections.js）：JS bin Demo

Answer 1

根据我们为解决问题而达成的讨论点：

• 用画布替换 div 元素以简化和更快地呈现。
• 使用第三方 js 库将节点和边缘渲染到画布中。