女王控的博客

前端

116 篇文章

RequestAnimationFrame的作用

原理 浏览器(如页面)每次要洗澡(重绘),就会通知我(requestAnimationFrame),而setTimeout貌似是多个独立绘制。 作用 统一的向下兼容策略 CSS3实现动画即高效又方便,但是对于PC浏览器,IE10+ CSS3实现,IE9-之流JS setTimeout实现,实现方式也是不统一,但是requestAnimationFrame跟setTimeout非常类似,都是单回调 为了统一代码,需要对IE9-的浏览器做下兼容性处理 简单的兼容(IE… »

DOM练手测试

DOM测试一 具体实现 我的解答 最佳解答 实现要点 获取所有a元素,两种方法:document.getElementsByTagName(‘a’) 所有浏览器都支持,还有document.querySeletorAll(‘a’),IE8+。 答案是:document.links或者document.querySelectorAll(‘:link’)都是可以的。链接元素和 元素的区别:首先没有href属性的 元素不是链接元素,其次链接元素还包括 元素(带href… »

JS练手测试

JS测试一 具体实现 我的解答 最佳解答 实现要点 空数组项也会作为length的一部分;空数组项和空字符串项是有区别的。 第2题,本题只是过滤空数组项,不包括null, undefined这类。 去除空数组项两个比较好的回答: 数组中的 empty 元素不会参与数组项遍历,故只需返回 true 即可过滤掉 empty 元素(而不会牵连 0、NaN、null、undefined、” 这些)arr.filter(it => true)。然后补充,但是走for循环,还是会遍历empty… »

CSS练手测试

练习地址: 小测答题收集区 CSS测试一 具体实现 overflow: hidden + float(不完美,显示的顺序与实际的 html 顺序不一致) flex + flex:1 table + table-layout: fixed(兼容性较好) 实现要点 大家布局其实这3类:float+overflow,然后是flex布局,很少人使用的table布局。 float布局技巧:float:right+overflow:hidden;text-overflow:ellipsis;white… »

treated as passive错误解决

Chrome和Safari浏览器preventDefault报treated as passive错误 其实这个问题出现有一段时间了,主要麻烦的是,以前没有,后来,Chrome和Safari浏览器升级了,然后出现这个错误,而且就在一个月前,Chrome浏览器还只是黄色的警告,现在直接就红色错误献上。 例如,随便新建一个空白页面,写上如下JavaScript代码: 然后在移动端模式下页面上点击滑来滑去记下,就可以看到一大堆错误: Intervention Unable to… »

0%