看似好像没用的小知识点 vol.1

• 子元素为 inline-block 时父级底部会有一点空隙，与 vertical-align + line-height 有关，案例
• canvas 的 lineWidth 即便设成 0 也还会是 1
• [NaN].indexOf(NaN); // -1 数组中找不到 NaN

• transform: scale(.5) 下的 offsetWidth 等仍是原宽，只能 getBoundingClientRect().width
• 其余浏览器下单页面项目的 /#/ 被认为是 hash，但 IE 浏览器会认为是路径，会形成没法访问
• <select> 的 readonly 仍是能点开，推荐使用 select[readonly] { pointer-events: none; }
• let 和 const 不会像 var 同样会在 window 下声明，好比 let a 是取不到 window.a 的
• wx.onMenuShareAppMessage 的 type 不能是空字符串，要么不传，要么 type: "link"
• wx.config 须要传入的连接，苹果机下若是使用过 history api 将签名失败
• CSS 的 content 的文本和图片，是不可选择的

• 苹果机键盘弹起后元素上移，键盘收回后元素不归位，用 $(document).scrollTop(0, 0); 解决（部分机型依旧不行）
• 3.0 版本前的 $.fn.param 会把空格转为 + 号，可能后来发现连接中的 + 与空格的 + 冲突因此砍掉了
• IOS 下的 webgl 不清晰，可显示 2d 的 canvas 绘制隐藏的 webgl 的 getImageDate 能清晰
• 小程序不会正确处理图片连接中 \，形成图片请求但不显示，只能是 / 式的路径，好比 图片

• 部分安卓机 background-image 与 border-radius 合用会不显示图片，需加上 background-color 才行
• input[type="number"] 不支持使用 selection 相关的光标操做
• 用 data:image/svg+xml, 拼出来的 SVG 背景图，background-size 不支持拉伸
• ES6 用变量做对象属性名时有点小问题，如 var a = 'x'; var obj = { [a]: 1 }; obj[a]; // 1 但其实应该只有 obj.x 的
  
• btoa 转 base64 不支持传入中文等 Unicode 字符，可搭配 encodeURIComponent 使用
  
• IOS 的 iframe 不支持传高度，最好有个父级包着并设 -webkit-overflow-scrolling 滚动

• input[type="checkbox"] 加字符串 checked="false" 或 setAttribute('checked', '') 也会勾选
• html 中 data-userId 会显示为全小写 data-userid，但 attr('data-USERID') 不区分大小写都能获取到
• UTF-16 字符在处理字符串时需注意，好比 '𠮷'.slice(-1) 会获得未知字符，恐怕只能用 for-of 来作了
• 空数组进行 every 判断始终为 true，需根据场景作好排除
• :last-child 是按 dom 位置来的，并不受 order 排序的影响
  
• display: inline 设 text-indent:-999em 无效
• 父级无高度时，子级 position: relative 的百分比定位 top: 50% 会无效
  
• 父级 overflow:auto; position:relative;，子级绝对定位并超出，结果会显示滚动条，并不是彻底脱离文档流
  
• <script src="xx.js" /> 不能使用单标签格式，否则会把后面的都当作文本
  
• ElementUI 的 el-date-picker[type="daterange"] 在 火狐 下不支持 yyyy.MM.dd 格式数据的传入，-/ 能够
  

• 有 mask 的元素 box-shadow 非 inset 形态无效，filter:drop-shadow() 也是如此（可放到父级去）
• min-width 的默认是 auto，而 max-width 的默认是 none
• https 下没法点击打开下载 http 的资源
• input[type="file"] 的触发会触发 window.onblur 事件，可用 document.activeElement 来进行排除
• 点击在 label[for] 的父级上，会触发两次 click，很迷
• new RegExp 需对特殊字符进行转义，好比 new RegExp('\\d').test(1) 才有效，仍是 /\d/.test(1) 好呀。
• 设置 border-image 后，border-radius 失效。
• 给定位的 body 设 background-size，如 100% 100% 或 contain 会没有相对高度，但 cover 有效。
• 苹果机上当 div 的 click 委托在 document 或 body 上会没法点击，可换为 a 或添加 cursor: pointer 等。见文
• 苹果机移动端 contenteditable 无效，需加上 -webkit-user-select: text

• 小程序的 cover-view 不能使用 :before 和 gradient 样式
• disabled 会禁掉 mouse 事件，却没有禁 touch 事件
• $.fn.serializeArray 方法会把回车 \n 改成 \r\n，增长了字符串长度
• Math.round 四舍五入方法可能有误，见 推文
• 苹果机在 QQ 浏览器中修改 document.title 无效，需新建删除一个 iframe 来骚操做
• 粘贴功能 execCommand('paste') 被各家浏览器禁用掉了
• 小程序的 cover-view 手机上不触发 touch 事件
• inline 行级元素设置 transform 无效
• 苹果机没有原生双击事件 dblclick
• :not(.x):last-of-type 并不表明去掉 .x 后的最后一个，它们是并列关系而非前后关系

---------------------------------------------------

先整理第一期吧，但愿对你有些帮助，

欢迎来 GayHub 给我 star 一下，嘤嘤嘤~