前端技术文章
-
localStorage数据永久存储且同源标签页共享，适合长期偏好和登录态；sessionStorage仅限当前标签页，关闭即清空，适用于表单草稿等临时状态；二者均只支持字符串，需手动JSON序列化，且localStorage可监听其他页变更而sessionStorage不可。483 收藏 -
能，但仅限于内联事件处理器中直接returnfalse时生效；现代推荐用event.preventDefault()，语义清晰且兼容异步流程。483 收藏 -
Grid容器overflow不生效最常见原因是子元素未超出容器空间或父容器高度未约束；需设明确高度、min-width:0/min-height:0、避免fr滥用、正确作用滚动样式于直接包裹内容的容器。483 收藏 -
mix-blend-mode不生效主因是被隔离在独立堆叠上下文或未触发GPU合成层；需检查父容器是否隐式创建stackingcontext，加isolation:isolate或transform:translateZ(0)解决。483 收藏 -
HTML5的template标签用于定义不渲染的可复用HTML片段，通过JavaScript克隆并插入DOM，适用于列表、卡片等动态内容，提升代码可读性和安全性。483 收藏 -
真正发光需2–3层text-shadow叠加，内层小模糊（2–4px）+外层大模糊（8–20px），颜色由实色渐变至半透，偏移量必须为0，且需依背景色调整配色与透明度。483 收藏 -
rgba()不解析CSS变量，因var(--color)返回字符串而非数值参数，导致声明失效；须拆分RGB为独立变量或逗号分隔字符串，再组合使用。483 收藏 -
history.pushState不触发页面跳转，因其仅修改URL和历史记录；需手动监听popstate事件并更新视图，且首次加载须主动读取location.pathname渲染。483 收藏 -
JavaScript生成器是能暂停和恢复执行的特殊函数，通过yield交出控制权并返回值；用function*声明，调用后返回可迭代的生成器对象，其next()方法逐步执行并返回{value,done}。482 收藏 -
核心思路是解耦WebSocket通信与DOM操作：收到消息后转为自定义事件（如"ws:chat:message"）派发，由业务组件监听响应。此举避免强耦合、提升复用性与可测试性，并支持多组件响应同一消息；需配合心跳状态事件、ACK机制及可选局部事件总线保障可靠性与性能。482 收藏 -
Permissions-Policy已取代Feature-Policy，旧头在Chrome100+等浏览器中静默失效；必须使用Permissions-Policy响应头和allow属性（分号分隔、括号指定来源），且需明确控谁、控什么、在哪控。482 收藏 -
VueRouter路径标准化是初始化时对path字符串的必经清洗处理，包括压缩多斜杠、折叠./..、统一根路径等，确保匹配稳定；它发生在createRouter阶段，由normalizePath()执行。482 收藏 -
用?构建高兼容性解析引擎需显式建模可选结构，结合业务语义、字符集、非捕获分组与锚点提升精度，慎用嵌套?防回溯爆炸，并配套fallback路径与部分匹配机制。482 收藏 -
fixed定位失效的根本原因是父容器使用transform、perspective或filter创建新层叠上下文，使fixed脱离视口参考系；z-index失效源于层叠上下文断层；iOS安全区需用env(safe-area-inset-bottom)适配；性能问题需优化will-change和pointer-events。482 收藏 -
animation-timing-function通过速度曲线控制CSS动画节奏，不改变总时长；支持ease、linear、ease-in/out、steps()及cubic-bezier()自定义，需符合[0,1]参数范围，且transition与animation共用该属性。482 收藏