首次打开浏览器窗口/选项卡后执行 JavaScript 代码

Execute JavaScript code once a browser window/tab is opened for the first time

本文关键字：执行 JavaScript 代码 选项 浏览器 窗口      更新时间：2023-09-26

有没有办法在浏览器中的窗口或选项卡打开时只执行一次 JavaScript 代码，然后在该窗口/选项卡的整个生命周期内再也不执行一次（即使导航离开）？

像这样使用window.sessionStorage的一种方法。

if (!window.sessionStorage.getItem("isExecuted")) {
    //execute code
    window.sessionStorage.setItem("isExecuted", true);
}

MDN 文档

会话存储

属性允许您访问会话存储 对象。sessionStorage 类似于 Window.localStorage，唯一的 不同之处在于，存储在本地存储中的数据没有设置过期， 存储在会话中的数据在页面会话结束时被清除。 只要浏览器处于打开状态并存活，页面会话就会持续 超过页面重新加载和还原。在新选项卡或窗口中打开页面 将导致启动新会话，这与 会话饼干工作。

这是一个基于检查 window.history.length 为 1 的解决方案（即他们第一次访问此窗口/选项卡）。它还会检查他们是否只是刷新了页面。 

if(window.history.length === 1 && performance.navigation.type  !== 1){
     alert("show me once per tab");
}

如果您将要运行的脚本放在我有警报的地方，它应该适用于您要执行的操作。

您可以使用 localStorage。

本地存储是按源（按域和协议）存储的。来自一个源的所有页面都可以存储和访问相同的数据。

localStorage 对象存储没有过期日期的数据。关闭浏览器时不会删除数据，并且将在第二天、一周或一年内可用。

localStorage.getItem('key');
localStorage.setItem('key', 'value');

文档：http://www.w3schools.com/html/html5_webstorage.asp

相关文章：