发生原因：当点击屏幕时，系统生成touch和click两个事件，touch先执行，touch执行完之后A消失，然后要执行click的时候，就会发现用户点击的是B，所以就执行了B的click
解决方法：①阻止默认事件，在touch的某个时间段执行event.preventDefault，去取消系统生成的click事件，一半在 touchend 中执行。②要消失的元素延迟300ms后在消失
margin塌陷和合并问题首先，margin塌陷是相对于父子级关系的两个元素，而margin合并是相对两个兄弟级关系的两个元素
两个兄弟级关系的元素，垂直方向上的margin，其外边距会发生重叠现象，两者两个的外边距取的是两个所设置margin的最大值，就是所说的margin合并问题
两个父子级关系的元素，垂直方向上的margin会粘合在一起，外层和模型的margin-top取两个元素中margin-top的最大值，发生margin塌陷的内层元素相对于整个文档移动
解决方案：两者都可以通过触发BFC来解决
CSS定位的方式有哪些分别相对于谁 static(默认值) absolute(绝对定位，相对于最近已定位的父元素，如果没有则相对于<html>) fixed(固定定位，相对于窗口) relative(相对定位，相对于自身) sticky(2017年浏览器开始支持，粘性定位)absolute会使元素位置与文档流无关，不占据空间，absolute 定位的元素和其他元素重叠
relative相对定位时，无论元素是否移动，仍然占据原来的空间
sticky是2017年浏览器才开始支持，会产生动态效果，类似relative和fixed的结合，一个实例是"动态固定"，生效前提是必须搭配top,left,bottom,right一起使用，不能省略，否则等同于relative定位，不产生"动态固定"的效果
移动端布局的解决方案，平时怎么做的处理使用Flexbox
百分比布局结合媒体查询
使用rem
rem转换像素大小（根元素的大小乘以rem值），取决与页面根元素的字体大小，即HTML元素的字体大小
em转换像素大小（em值乘以使用em单位的元素的字体大小），比如一个div的字体大小为16px，那么10em就是180px（或者接近它）
rem平时怎么做的转换：为了方便计算，时常将html的字体大小设置为62.5%，那么12px就会是1.2rem
JavaScript 列表无限滚动曾经有遇到过嘛简单列表滚动加载是监听滚动条在满足条件的时候触发回调，然后通过把新的元素加入到页面页尾的方法完成，但是如果用户加载过多列表数据(比如我这一个列表页有一万条数据需要展示)，那么用户不断加载，页面不断增加新的元素，很容易就导致页面元素过多而造成卡顿，所以就提出的列表的无限滚动加载，主要是在删除原有元素并且维持高度的基础上，生成并加载新的数据
如果滚动过快怎么办，高频率触发事件解决方案-防抖和节流节流：在一段时间内不管触发了多少次都只认为触发了一次，等计时结束进行响应（假设设置的时间为2000ms，再触发了事件的2000ms之内，你在多少触发该事件，都不会有任何作用，它只为第一个事件等待2000ms。时间一到，它就会执行了。 ）
//时间戳方式 function throttle(fn,delay){ let pre = Date.now(); return function(){ let context = this; let args = arguments; let now = Date.now(); if(now - pre > delay){ fn.apply(context,args); pre = Date.now(); } } } //定时器方式 function throttle(fn,delay){ let timer = null; return function(){ let context = this; let args = arguments; if(!timer){ timer = setTimeout(function(){ fn.apply(context,args); timer = null; },delay) } } }防抖：在某段时间内，不管你触发了多少次事件，都只认最后一次（假设设置时间为2000ms，如果触发事件的2000ms之内，你再次触发该事件，就会给新的事件添加新的计时器，之前的事件统统作废。只执行最后一次触发的事件。）
//定时器方式 function debounce(fn,delay){ let timer = null; return function(){ let context = this; let args = arguments; clearTimeout(timer); timer = setTimeout(function(){ fn.apply(context,args); },delay) } } 解释一下变量提升JavaScript引擎会先进行预解析，获取所有变量的声明复制undefined，然后逐行执行，这导致所有被声明的变量，都会被提升到代码的头部（被提升的只有变量，值不会被提升），也就是变量提升（hoisting）
console.log(a) // undefined var a = 1 function b(){ console.log(a) } b() // 1