- 博客(9)
- 收藏
- 关注
原创 告别 CSS 滤镜兼容噩梦:前端工程化的一站式解决方案
在实现设计稿中的模糊效果时,我们兴奋地写下:却在测试时发现:iOS 8.1 设备上效果消失IE浏览器直接罢工旧版Firefox显示异常于是不得不改写成:此时才发现:各浏览器语法差异巨大多重fallback顺序敏感SVG参数计算复杂易错代码维护成本指数级增长更隐蔽的陷阱是幽灵前缀问题:无效代码增加样式表体积(平均+17%)某些浏览器会忽略整条规则团队形成错误的前缀认知
2025-02-19 23:33:41
303
原创 JS正则表达式如何匹配任意字符
在 JavaScript 中,匹配任意字符是一个常见的需求。虽然[\w\W]是一种通用且安全的方式,但某些开发者可能会使用[^],这可能导致兼容性问题。通过使用插件,我们可以自动将[^]转换为[\w\W],从而确保代码在所有环境中都能正常工作。这种转换不仅提高了代码的兼容性,还减少了因环境差异导致的错误。如果你的项目中使用了[^],强烈建议你使用插件来解决潜在的兼容性问题。
2025-02-17 00:02:16
336
原创 前端如何优雅实现0到auto的高度过渡
各位好,相信大家都知道,最近更新 Chrome 已经支持了 0 到 auto 的高度过渡。但是很多人反映这种特性太新了,出于兼容考虑用不了的。而实际上 calc-size 是可以渐进增强的。今天我就给大家表演一下,0 到 auto 的渐进增强兼容所有浏览器。
2024-10-17 00:28:18
290
原创 前端实现一个完整的三级联动有多难?
大家好,3 级联动是前端开发过程常用的业务功能。但是大家知道一个完整的前端三级联动有多难吗?下面让我给大家讲一讲。
2023-08-17 22:50:40
184
1
原创 这 5 种前端开发不良习惯一定要避免,最后一种最可怕
注意看,这个是一个大屏报表的示例,里面的每一个面板都有复杂的交互功能。同样我们看这种管理后台,增删改查全部放到一个文件里了,弹窗一多简直就是灾难。注意看,这个这里有一个翻页,我点了第二页,然后还在加载的时候点第三页,第二的请求并没有终止,会导致页面错乱。注意看,这个按钮未做防重复点击。当用户按下按钮时,如果未做防重复点击,轻则用户体验不佳,重则业务罗辑错误甚至造成财产损失。好了,本期的分享就到这了。第三,没有在恰当的时候,终断网络请求。第四,没有考虑好用户的退后操作。第五,没有处理必定会发生的错误。
2023-07-29 21:34:20
133
原创 工程化是解决浏览器兼容性的核心
前端开发在日常的项目中,面对的难题之一便是浏览器兼容性问题。不同浏览器依赖的渲染引擎、JavaScript 引擎等技术栈和规范有所差异,往往会导致同一个网页在各种浏览器上呈现效果不同。而针对这一问题,前端工程化被视为解决浏览器兼容性的核心。
2023-07-29 21:06:16
90
原创 js鼠标事件中的clientX/clientY,screenX/screenY,pageX/pageY,offsetX/offsetY,layerX/layerY,x/y
clientX/clientY,screenX/screenY这两组是标准,一般用这两组,就没问题了clientX/clientY相对于目标可视区的坐标,不包括边框,不会随滚动条变化screenX/screenY位置相对于用户屏幕============================================================下面是其他
2016-07-18 08:08:39
762
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人