javascript - 当我使用 ajax 和 jquery 的 $.get() 渲染新内容时，旧内容会发生什么？

Question

我的网站上有一个仪表板功能，我使用 ajax 和 jquery 来呈现部分内容。也就是说，我有一个侧边栏，当用户单击其中一个项目时，页面内容会发生变化，但侧边栏、导航栏、页脚不会发生变化，您就明白了。

但是不再显示的内容会怎样呢？它是否仍然在后台减慢我的页面速度？我应该避免以这种方式交替显示大量内容吗？

Answer 1

这取决于实现。我们举一个简单的例子:

$(function () {
  $("aside nav a").click(function (e) {
    e.preventDefault();
    $("#content").load($(this).attr("href"));
  });
});

<script src="https://code.jquery.com/jquery-2.2.4.js"></script>
<aside>
  <nav>
    <ul>
      <li><a href="">Link 1</a></li>
      <li><a href="">Link 2</a></li>
      <li><a href="">Link 3</a></li>
      <li><a href="">Link 4</a></li>
      <li><a href="">Link 5</a></li>
    </ul>
  </nav>
</aside>
<main>
  <h1></h1>
  <div id="content"></div>
</main>

上面的代码废弃了 #content div 内的所有内容并从 AJAX 加载新内容。旧内容不存在在页面的任何地方。大多数实现与此类似。