当网页失去焦点时改变网页的title值

Posted 2020-09-27 薛伟杰

<script>
     document.addEventListener(‘visibilitychange‘, function() {
      var isHidden = document.hidden;
      if (isHidden) {
       document.title = ‘改变后的标题‘;
      } else {
       document.title = ‘未改变的标题‘;
      }
     });
</script>

  visibilitychange事件是浏览器新添加的一个事件，当浏览器的某个标签页切换到后台，或从后台切换到前台时就会触发该消息，现在主流的浏览器都支持该消息了，例如Chrome, Firefox, IE10等

   举个栗子，比如在html5开发的小游戏中，因切换页面或窗口化页面时，需暂停游戏，从而触发 visibilitychange  事件

  1.hidden：页面在后台标签页中或者浏览器最小化

  2.visible：页面在前台标签页中

  3.prerender：页面在屏幕外执行预渲染处理 document.hidden 的值为 true

  4.unloaded：页面正在从内存中卸载