随笔

• 判断一个数组中是否有重复的值

function isRepeat(arr){
  var hash = {};
  for(var i in arr) {
      if(hash[arr[i]])
          return true;
      hash[arr[i]] = true;
  }
  return false;
}

• 浏览器支持图片懒加载

<!-- Lazy-load an offscreen image when the user scrolls near it -->
<img src="unicorn.jpg" loading="lazy" alt=".."/>

<!-- Load an image right away instead of lazy-loading -->
<img src="unicorn.jpg" loading="eager" alt=".."/>

<!-- Browser decides whether or not to lazy-load the image -->
<img src="unicorn.jpg" loading="auto" alt=".."/>

• 页面可见性判断：document.hidden与visibilitychange事件

    let hidden = null;
    let visibilityChange = null;
    if (typeof document.hidden !== 'undefined') {
      hidden = 'hidden';
      visibilityChange = 'visibilitychange';
    } else if (typeof document.mozHidden !== 'undefined') {
      hidden = 'mozHidden';
      visibilityChange = 'mozvisibilitychange';
    } else if (typeof document.msHidden !== 'undefined') {
      hidden = 'msHidden';
      visibilityChange = 'msvisibilitychange';
    } else if (typeof document.webkitHidden !== 'undefined') {
      hidden = 'webkitHidden';
      visibilityChange = 'webkitvisibilitychange';
    }

    // 添加监听器
    document.addEventListener(visibilityChange, () => {
      console.log('当前页面是否被隐藏：', document[hidden]);
    }, false);

• 视频样式

1. 去掉全屏控件：

video::-webkit-media-controls-fullscreen-button {
   display: none !important;
} 

2. 隐藏控制台：

video::-webkit-media-controls-enclosure {
  display: none !important;
}