对Tap事件和Tap点透原理的分析

//定义tap函数，传入需要绑定的元素，和一个回调函数function tap(el,callBack){    var startTime = 0;    var maxTime = 250;    var [startX,startY,endX,endY] = [0,0,0,0]; //es6解构赋值    el.addEventListener('touchstart',function(e){                                    console.log('touchstart');        startTime = Date.now(); //开始触摸的事件          startX = e.touches[0].clientX; //手指在浏览器横坐标        startY = e.touches[0].clientY; //手指在浏览器纵坐标    })    el.addEventListener('touchmove',function(e){        console.log('touchmove');        endX = e.touches[0].clientX; //手指在浏览器横坐标        endY = e.touches[0].clientY; //手指在浏览器纵坐标    })    el.addEventListener('touchend',function(e){        console.log('touchend');        if( (Date.now()-startTime) > maxTime){ //如果超过了最大时间，不触发tap               console.log('超时了');            return ;         }        //如果移动距离过大，则不是tap事件。为了大家在电脑上能看到效果，这里设置成了1000，因为在电脑上移动幅度不好控制。如果是在移动端，设置为30就差不多了。        if(Math.abs(endX-startX) > 1000 || Math.abs(endY-startY) > 1000){             return;        }        callBack(e);     })}tap(document.documentElement,function(e){    console.log(e);});