click和tap以及事件穿透

click在移动端有太多复杂的功能是监听不到的，例如，触摸、按住和轻滑，且click事件时间上会有延迟，大概200-300ms，这时候就要用tap方法了。

但是tap还有一个特点就是事件穿透，就是你执行完绑定的tap事件之后呢，如果下面如果绑定了其他事件或者是本身就存在点击事件的话，也会默认触发。

解决办法

1. 第一种  通过执行e.preventDefault()阻止touchend事件的默认行为,

  // 第一种  通过阻止touchend事件的默认行为,
  // e.preventDefault()
 
top1.ontouchend = function (e) {      
      e.preventDefault()
        console.log("我准备关闭上层的按钮了");
        top1.style.display = "none";
      };
      btm.onclick = function () {
        console.log("我被点击了");
      };

2. 第二种 延迟300ms再关闭

 setTimeout(()=>{
          top1.style.display ="none";
     },350)

3. 第三种：使用插件 fastclick.js 防止手势穿透, 这个插件专为解决手势穿透现象而生

 <script src="https://cdn.bootcdn.net/ajax/libs/fastclick/1.0.6/fastclick.js"></script> 
 
 
  FastClick.attach(document.body);