Question

我正在一个网站上工作，让我们说我们有一个带有2个div的index.html。

<div id="top">
    Some Content
</div>
<div id="content">
    Some Content
    <a href="page.html"></a>
</div>

内容id div有一个锚标记。当我点击锚标记时，page.html会在同一个标签中加载。现在，当我按下浏览器的后退按钮时，我希望不能出现带有id的div。实际上，我只是想当有人第一次访问网站时，div顶部应该出现，然后不应该再次出现，即使有人跟踪链接并试图返回。虽然，当有人再次在新标签页中打开网站时，网站应该重新出现（顶部div和同样的东西）。有可能吗？

Answer 1

这可以通过JavaScript实现，但在服务器端可能做得更好。

<!DOCTYPE html>
<html>
<head>
  <title>Example</title>
  <script>
    var content, body;
    document.addEventListener("DOMContentLoaded", function() {
        content = document.getElementById("content");
        body = document.getElementsByTagName("body")[0];
        if (localStorage.getItem("wasHere") !== null) {
            body.removeChild(content);
        } else {
            localStorage.setItem("wasHere", "true");
        }
  });
  </script>
</head>
<body>
  <div id="top">
      Some Content
  </div>
  <div id="content">
      <!-- You need to put text inside links for them to show -->
      <a href="page.html">Some Content</a>
  </div>
</body>
</html>

此解决方案的问题是localStorage很容易修改且不可靠。因此，您应该再次使用服务器端解决方案。如果你需要它，那就在那里。

当用户导航回网站时，完全删除div

1 个答案: