如何改变浏览器标签页名称?

实现效果:

1.当切换到其他网页时,网页标题为“别走!来玩啊”

2.当切换为本网页时,网页标题为“哇!你终于回来啦”

3.过2s后标题切换为原网页标题

实现方法:

1.监听浏览器页面切换

document.addEventListener("visibilitychange", (function () {...}));
  • 这行代码为document对象添加了一个事件监听器,监听visibilitychange事件。当页面的可见性发生变化时,会执行提供的函数。

2.当页面变化,更改标题

  document.hidden判断页面是否课件。

  document.title可以获取页面标题,配合监听器可以改变标题内容。

document.addEventListener("visibilitychange", (function () {
  document.hidden ? document.title = "w(゚Д゚)w 别走!来玩啊" : document.title = "♪(^∇^*)哇!你终于回来啦!")
}));

3.实现页面切换回来后,2s后标题变为原标题

let titleTime, OriginTitile = document.title;
document.addEventListener("visibilitychange", (function () {
  document.hidden ? (document.title = "w(゚Д゚)w 别走!来玩啊", clearTimeout(titleTime)) : (document.title = "♪(^∇^*)哇!你终于回来啦!", titleTime = setTimeout((function () {
    document.title = OriginTitile
  }), 2e3))
}));

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值