javascript - 仅在新会话上显示元素并刷新

Question

这里的任务是仅在您打开网页以及刷新网页时“第一次”显示元素。导航中的链接会将您重定向到另一个 *.html 页面，并且每个 *.html 页面中包含的“全局”div 元素仅应在以下情况下显示：

1. 第一次打开网页（关闭网页/标签，再打开也算第一次打开网站）
2. 刷新了网站上的页面。

文件结构和大致代码如下所示： https ://stackblitz.com/edit/js-ocytv4?file=index.html

我很习惯做 SPA，所以我什至不确定这是否可以用纯 JS 来做，因为网页总是会被卸载并再次加载。

我尝试添加会话存储项以进行检查，但在这种情况下，无法.introduction在刷新时删除。我尝试检查 document.referrer 和实际的 window.location.href 也无济于事，存在不一致之处。例如，我可以这样做：

const ref = document.referrer
const href = window.location.href
const showIntro = () => {
    introductionNode.classList.remove('hidden')
}

if (!ref || ref === href) {
    removeIntro()
} else {
    removeIntro()
}

但是，显然当我从Page2 到达Page1 时，我的referrer 将是Page1 并且不会设置为Page2，因此在刷新页面时，不会隐藏介绍块。并且只有当我第二次点击导航中的链接时才能工作，在同一页面上。

标签： javascripthtml