-
JavaScript中最推荐的单例实现是模块级单例,利用ES6模块默认导出的天然单例特性,简洁、可靠且符合语言习惯;其次为ES6Class配合静态工厂方法,避免直接new;闭包方式适用于ES5环境。
-
Array.prototype.every()返回布尔值,天然适配“全通过才放行”的权限校验;支持短路求值、零额外开销、链式嵌套、否定校验,但需防范空数组误判及undefined异常。
-
应使用CSScolor属性而非废弃的<font>标签;内联样式适合临时调试,类选择器利于统一维护;需显式定义伪类如:hover;注意可访问性与对比度规范。
-
embed标签必须显式设置type="application/pdf",否则Firefox/Safari会失败;iframe兼容性更好;复杂功能需用pdf.js实现。
-
column-width是建议宽度而非强制分割,需父容器设width或max-width才生效;多列与视差滚动原生不兼容,应改用Grid/Flex模拟列结构并手动实现视差。
-
appearance:none单独使用基本无效,必须配合-webkit-appearance:none、-moz-appearance:none三前缀声明,立即设置width/height防塌缩,并用position:absolute+clip隐藏原生控件以保障可访问性与点击区域。
-
@layer优先级由源码中声明顺序决定,第三方样式未包装则落入隐式顶层并高于所有显式层;必须用@importurl()layer()显式导入框架到指定层,且@layer声明须在顶层、不可嵌套。
-
轮播图的指示器和左右箭头必须共用同一BEM块名carousel,分别命名为carousel__indicator和carousel__control,后者用--prev/--next修饰符区分方向,禁用状态统一用--disabled修饰符,确保样式隔离、状态同步与事件委托一致。
-
最稳妥的做法是用rgba()或hsla()设置background-color实现背景半透明,避免使用opacity(会导致整个元素及子元素变透明);现代浏览器均支持,可结合CSS自定义属性动态控制。
-
WebSocket需手动实现重连机制,关键包括:onclose须在readyState=0时用addEventListener绑定;采用指数退避(起始1s、倍率1.6、上限30s)并设最大重试次数;结合心跳(25sping/15spong超时)与连接标识防消息混乱;所有send前校验readyState===OPEN且匹配_ws._id。
-
main标签用于定义页面核心内容,提升语义化与可访问性,一个页面仅能使用一次,不可嵌套在header、footer等元素内,应排除导航、页脚等公共部分。
-
scroll-padding在固定导航栏下跳转遮挡标题,因其默认作用于根容器且不自动补偿导航栏高度;需在滚动容器设scroll-padding-top(如calc(64px+env(safe-area-inset-top))),动态高度需JS更新;可与scroll-snap-type共用但需注意Safari优先级问题;Safari15.4+存calc+env首次失效bug,Firefox不支持逻辑属性缩写。
-
:first-child选中父元素下第一个子元素,:last-child选中最后一个子元素,二者均要求该元素满足选择器条件且位于对应位置,如p:first-child仅当p为首个子元素时生效,p:last-child同理,关键区别在于目标子元素的位置不同。
-
grid-row跨行必须指定起始和结束行线,如2/4占第2、3行;支持命名线如a/c,span需配合起点如3/span2;单独span2由浏览器自动分配起点但不可控。
-
直接用eval或Function不安全,因其共享全局作用域、可读取window.location、返回真实window,并可能通过原型链污染影响宿主;Proxy沙箱通过代理空壳对象、拦截属性访问、重写高危方法及禁用with等手段实现真正隔离。