系统自带webview里的注意点
1.IOS端:active不生效
常见效果长按按钮状态发生变化,比如切换src等，用:active再方便不过，可是可是。。。
解决方案：body标签里绑定个<body ontouchstart=""></body>,可写js绑定
2.IOS端:div,span,p...绑定click无效
在绑定事件的元素加 cursor: pointer;
3.IOS端：点击会有黑色阴影，很丑
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
4.IOS端，安卓部分低版本系统，X5内核 不支持弹性布局的flex-wrap:no-wrap
如果用户量很大，建议还是换一种布局方式
5.webview里在body,html加overflow-x,overflow-y等属性，会导致原生滚动条很卡顿，而且还会导致原生客户端监听不到滚动长度
找到对应元素，设置overflow-x,overflow-y或者在body,html加 -webkit-overflow-scrolling: touch; 会使滚动条顺滑
6.line-height==height 在安卓上显示偏上问题，不垂直居中
选择加padding替代line-height
7.在ios中post请求，会缓存，虽然在ajax中设置不缓存
手动在请求url后加个随机数params
8.部分较新的es5工具函数，各大webview支持性各异，比如ios不支持sort...
9.魅族系统定时器播放序列动画，设置时间无效（总感觉是有定时器的最小时间，我在动画里设置的是66.7ms，不算很快，但是显示卡顿，手动设置30ms，播放动画还是之前那样，没效果）rrequestanimationframe又不支持，蓝瘦
10.小米系统6.0版本使用iscroll，内部内容不能滚动，最后只能使用overflow:auto
以下部分针对安卓4.3系统以下webview兼容性
1.对css兼容性很差，比如calc，display:flex...
2.对于一些常用的比如在一个div里设置个背景图片，div里没东西，设置宽高，但是安卓低版本无效。显示不出该元素，但是绝对定位了该元素，却显示出正确的宽高的元素
3.对于一个元素相对定位同时又margin:0 auto ,该元素不会居中...不设置相对定位，居中
还有很多，如果产品依然让兼容4.3以下系统，准备好接各种锅吧...
正好想到的杂碎东西
1.关于js精度问题
需求（出现在小程序中）：后端生成17位数字的id，传到浏览器端后，经过ajax库处理，id会随机-1，在原数字上，原因：js超过16位的整数会出现精度问题，所以最终后端处理
2.异步获取数据，给后端传的数据是数组的情况下。需特殊处理（前提后端解析是以表单形式的‘Content-Type‘: ‘application/x-www-form-urlencoded‘）
jq ajax中 设置transition:true
axios中，在配置中设置
transformRequest: [function (data) {
// Do whatever you want to transform the data
let ret = ‘‘
for (let i in data) {
if(typeof data[i] == ‘object‘){
let listData = data[i]
for(let k = 0; k < listData.length; k++ ){
ret += encodeURIComponent(i) + ‘=‘ + encodeURIComponent(listData[k]) + ‘&‘
}
}else{
ret += encodeURIComponent(i) + ‘=‘ + encodeURIComponent(data[i]) + ‘&‘
}
}
ret = ret.substring(0,ret.length-1)
return ret
}]
关于Andriod
安卓不能缓存https里的webview（只能是http
）
