前端的一些坑

时间 2019-12-10

标签前端一些繁體版

原文原文链接

一、inline-block元素自带的4px边距

设置父元素font-size:0;letter-spacing:-4px;

而后设置子元素正常的font-size和letter-spacing;

二、移动端JS给页面设置scrollTop出现闪屏问题

给body加上属性：-webkit-overflow-scrolling: touch;

三、移动端ios浏览器/ios端微信浏览器，使用$(document).on()绑定事件失效

给要绑定的元素加个一个空的onclick=""，或者给该元素加上css{cursor: pointer;}

四、某些手机自带浏览器不支持css属性缩写

css属性尽可能分开写，好比background: url(xxx.jpg) no-repeat 0 0/100% 100%;改成background: url(xxx.jpg) no-repeat;background-position: 0 0;background-size: 100% 100%;

五、当你动态加载的数据中$(".xxx").on("click",function(){})点击无响应

你能够将你的事件写成一个方法，在动态加载完成后，从新调用一次就好了

六、JS中使用加减运算浮点数的时候，可能会出现精度丢失的问题

例如 0.1+0.2=0.30000000000000004，获得的结果不等于0.3，解决方法是截取小数点后几位数，再作比较

七、$(obj)[0]，这样就取到的元素对象就不是JQuery对象了

你可使用$($(obj)[0])就能够从新取到JQuery对象了

八、CSS中active伪类在ios移动端无效

你在外层加上ontouchstart=""和onmouseover=""就能够了

例如：<body ontouchstart="" onmouseover=""></body>