离开标签页时标题会变：博客动态标题的实现

有些博客在你切走标签页时，标题会变成「你别走吖 Σ(っ °Д °;)っ」，切回来又变成「(/≧▽≦/)你又回来啦！」。这个效果只在前端完成，和服务器没有关系，核心是监听页面可见性变化的一句 JavaScript。

实现原理

浏览器在标签页隐藏和重新显示时会触发 visibilitychange 事件，document.hidden 会同步反映当前状态。做法就是页面加载时先把原标题存下来，隐藏时改 document.title，重新可见时恢复。

var OriginTitle = document.title;
document.addEventListener('visibilitychange', function () {
    if (document.hidden) {
        document.title = '你别走吖 Σ(っ °Д °;)っ';
    } else {
        document.title = OriginTitle;
    }
});

代码放在哪里

WordPress 站点最省事：后台主题设置里的自定义代码入口（自定义 JavaScript 代码）粘贴上面这段即可，不用动模板文件。没有这个入口的主题，也可以在 header 模板里手动加一个 script 标签引入。

注意事项

两段文案可以随意改成自己喜欢的字样，颜文字、emoji 都没问题，前提是站点编码为 UTF-8，否则标题会乱码。另外两点要有预期：手机端浏览器对切后台是否算 hidden 的实现不一致，部分机型上看不到效果；这只是个趣味装饰，不影响书签内容和收录，预算再低的机器也不会因此变卡。