前端技术文章
-
正向肯定断言(?=...)的核心价值在于零宽度检查：不移动指针、不捕获内容，适用于多条件并列校验（如密码强度）和边界上下文约束（如JSON键名提取）。245 收藏 -
flex-direction唯一决定主轴方向，justify-content仅沿主轴对齐；设为column后justify-content控制上下对齐，而非左右；固定宽高需配合flex-basis或媒体查询适配方向切换。218 收藏 -
HTML原生不支持下拉刷新，需用touch事件结合scrollTop判断顶部状态实现；pullDownAction中须控制加载态、安全更新数据源与DOM，并确保滚动上下文一致。202 收藏 -
工厂模式是普通函数，直接调用返回新对象，不依赖new且this无关紧要；构造函数需用new调用，通过this绑定属性方法，支持instanceof和原型继承。160 收藏 -
CSS不能选择父元素因浏览器渲染机制限制，反向查找影响性能；可通过:has()伪类、结构调整或JavaScript间接实现。421 收藏 -
length统计UTF-16编码单元数而非字符数，导致代理对字符（如?、?）length为2；应使用Array.from()、Intl.Segmenter或codePointAt()获取真实字符数。493 收藏 -
color-mix()中使用lch()不报错而是被忽略，因旧版浏览器不支持lch()/oklch()；需用@supports(color:lch(0%00))检测并包裹，且混合色空间必须一致，fallback颜色须写在@supports外部以确保降级可靠。475 收藏 -
最稳妥方案是直接在<summary>中嵌入带viewBox和title的inlineSVG，确保缩放清晰、颜色继承、无障碍语义完整且无网络请求。311 收藏 -
可通过五种方法动态修改background-image：一、直接设置style.backgroundImage；二、切换预定义CSS类；三、利用CSS变量setProperty；四、动态创建style标签注入规则；五、使用base64编码内联图像。107 收藏 -
动态加载CSS应优先用link标签，需设rel="stylesheet"和href，避免仅依赖onload；并发插入要按层叠顺序严格控制；重复插入需查重；fetch+insertRule仅适用于小量规则且有诸多限制。375 收藏 -
最稳方案是用.breadcrumb-item:not(:last-child)::after添加分隔符，避免+选择器失效和语义缺失；需设content、vertical-align:middle和line-height:1，小屏用content:""隐藏，确保响应式与无障碍兼容。389 收藏 -
Pinia实现模块化数据共享的核心是通过storeToRefs保持响应式、$subscribe监听状态变更、defineStore抽离共享逻辑层，并谨慎使用$state跨模块写入。350 收藏 -
用text-indent配合媒体查询可响应式调整缩进，但必须用em或rem单位；px和%在多断点下易失控，因缩进需随字号等比变化以保持中文排版语义，且须确保元素为块级并处于BFC中。277 收藏 -
z-index不生效的主因是元素未处于定位上下文中。CSS中z-index仅对position为relative、absolute、fixed或sticky的已定位元素有效，且受层叠上下文层级限制，需检查父容器是否创建了新的层叠上下文。224 收藏 -
模板字面量类型真正落地的价值在于编译期捕获路径参数类型错误并支持IDE自动提示合法路径；需结合条件类型+infer递归解析占位符，精确推导RouteParams为对象字面量而非Record，且须与useParams等Hook深度集成。374 收藏