gpt4 book ai didi

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

转载 作者:行者123 更新时间:2023-12-03 12:18:26 24 4
gpt4 key购买 nike

我正在开发一个网站,假设我们有一个包含 2 个 div 的 index.html。

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

内容 ID div 有一个 anchor 标记。当我单击 anchor 标记时,page.html 会加载到同一选项卡中。现在,当我按下浏览器的后退按钮时,我希望带有 id 的 div 不应该出现。实际上,我只是希望当有人第一次访问该网站时,div 顶部应该出现,然后即使有人点击链接并尝试返回,也永远不会再次出现。不过,当有人再次在新选项卡中打开该网站时,该网站应该再次出现(顶部 div 和相同的内容再次出现)。可能吗?

最佳答案

这可以通过 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 很容易修改且不可靠。因此,再次强调,您应该真正使用服务器端解决方案。不过,如果您需要的话,它就在那里。

关于javascript - 当用户导航回网站时完全删除 div,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/24563089/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com