序言

浏览某站发现了一个特别有意思的效果

于是想手动实现一下这个可爱的表情变化功能。

实现

先从触发的哪类事件触发,千辛万苦发现其利用了visibilitychange事件,以下来自MDN对此事件的定义

当其选项卡的内容变得可见或被隐藏时，会在文档上触发 visibilitychange (能见度更改) 事件。

那实现不就简简单单了?直接上代码

   document.addEventListener('visibilitychange', () => {
     const title = document.querySelector('title')
     title.innerHTML = title.innerHTML === `o(╥﹏╥)o` ? '(づ｡◕‿‿◕｡)づ' : 'o(╥﹏╥)o';
 })

首先拿到title的内容,然后事件坚挺到了就做对应的修改,完毕!

\