针对移动端的兼容问题总结

1.为了使用safari中的辅助功能，iOS10会忽略meta标签的'user-scalable=no'

document.documentElement.addEventListener('touchstart', function (event) {
  if (event.touches.length > 1) {
    event.preventDefault();
  }
}, false);    

2.安卓浏览器看背景图有些设备会模糊，使用2x图解决？
因为在安卓的机型太多，同样的不同机型的dpr也不尽相同，1、1.5、2、3、4...
想要使图片清晰，需要使用2x图。

3.keyup和keydown在ios设备上失效，ios系统的屏蔽机制不会处理第三方输入法的事件系统

document.getElementById('testInput').addEventListener('input', function(e){
   var value = e.target.value;
});

4.弹窗冒泡造成的问题
弹层的关闭事件容易触发弹层关闭后下一层的事件所以要给弹层关闭事件加上event.preventDefault()
弹层弹出后不允许屏幕滚动给弹层加mousemove事件event.preventDefault()

5.input为fixed定位在ios下的bug问题:input固定定位在顶部或者底部，在页面滚动一些距离后，点击input(弹出键盘)，input位置会出现在中间位置。可以使用内容列表框也是fixed定位,这样不会出现fixed错位的问题

6.移动端上下拉动时感到有阻力或者卡顿，使用overflow-scrolling: touch;

7.input 有placeholder情况下不要设置行高，否则会placeholder文字会偏上

8.解决安卓中window.location.reload()失效的问题

window.location.href = location.href+'?time='+((new Date()).getTime());
//也可以加一个随机数

9.移动端页面input 的type设置为number出现的问题
(1)、maxlength属性失效

<input type="number" oninput="if(value.length>11)value=value.slice(0,11)" />

(2)、表单提交会取整

<input type="number" step="0.01" />

(3)、仍然可以输入e和小数点(看需求)

$('input[type=number]').on('input', function(e) {
　　if (!String.fromCharCode(e.keyCode).match(/[0-9]/)) {
　　　　return false;
　　}
});

10.常用的几个es6方法
(1)、Set结构数组去重

let arr = [2,3,2,1,3,3,1,2,3];
arr = [...new Set(arr)]; // arr = [1,2,3]

(2)、解构赋值实现交换赋值

let a = 1, b = 2;
[a, b] = [b, a]; // a = 2, b = 1

(3)、扩展操作符实现拼接数组和对象

let arr1 = [1,2,3], arr2 = [4,5,6];
let arr = [...arr1, ...arr2];

11.移动端页面调起拨打电话功能

<a href="tel:400-060-960">400-060-960</a>