前端技术文章
-
SharedWorker由JavaScript实例化，非HTML创建；需满足同源、HTTPS/localhost、独立JS文件三大条件，否则构造失败。典型问题包括浏览器不支持、SecurityError、脚本404、跨源加载；页面端须显式调用port.start()才能通信；调试需切换DevTools上下文至shared_worker；共享变量无原子性，需防并发更新。355 收藏 -
直接改--bs-gutter-x或--bs-gutter-y最轻量推荐，因不依赖Sass编译；不能直接改.row的margin或.col的padding，否则破坏负边距与正内边距配对机制，导致内容偏移、换行错乱。322 收藏 -
HTML无法实现真正的301重定向，因为HTTP状态码由服务器决定，而<metahttp-equiv="refresh">仅触发客户端跳转（等效302），返回200状态码，不传递权重且影响SEO。310 收藏 -
<sub>和<sup>仅支持线性文本内的垂直偏移，无法表达键角、空间构型、共价键等结构式要素；它们只适用于原子数、电荷、同位素等短文本语义标记，结构式需SVG、Canvas或ChemDoodle等专用方案。223 收藏 -
createElement创建XML节点必须用document.createElementNS；动态添加属性须用setAttributeNS；文本内容需用createTextNode；序列化须用XMLSerializer.serializeToString。347 收藏 -
position:sticky在flex布局中失效，因flex容器默认不创建滚动上下文；应改用fixed定位或确保父容器有明确高度和overflow-y:scroll，并避免transform等干扰属性。486 收藏 -
按钮按下缩放无效需检查:active触发条件、添加transition实现动画、移动端适配touch-action和viewport、用will-change优化渲染。176 收藏 -
最快方式是用最小可用HTML模板：<!DOCTYPEhtml><html><head><metacharset="UTF-8"></head><body><p>Hello</p></body></html>，保存即双击浏览器运行，不搭环境、不装工具、不配服务器，先确保结构合法可渲染，再逐步叠加功能。150 收藏 -
String.prototype.repeat()是轻量高效的字符串重复方法，适用于生成UI骨架屏中的占位文本、分隔线及多行段落，配合CSS可实现视觉一致的加载效果。164 收藏 -
根本原因是子元素未横向铺开且未真实溢出：必须同时满足内容总宽度＞容器宽度、子元素处于同一行内流（如flex-wrap:nowrap或white-space:nowrap），否则overflow-x:auto无效。360 收藏 -
必须用Mixin而非重复手写flex属性组合，因其能杜绝拼写错误、集中响应式逻辑、支持参数化复用；:extend()仅适用于无参静态结构共享。322 收藏 -
异步循环中属性查找变慢主因是对象形状漂移致内联缓存（IC）退化，而非异步本身；应保持对象结构稳定、统一构造、预热IC、避开Proxy/with/eval及循环解构，并用--trace-ic等工具验证IC状态。192 收藏 -
ElementPlus的ElRadioGroup和ElCheckboxGroup通过插槽+provide/inject+v-model实现子项值自动收集，轻量解耦；子组件注入上下文并注册自身，双向绑定父级modelValue，响应式驱动选中状态同步，支持跨层级嵌套场景。333 收藏 -
虚拟滚动通过“双层滚动容器+列分离渲染”实现固定列：分左/中/右三区域，各自虚拟滚动并同步纵横向滚动；固定列不横向滚动，中间区负责横向滚动并补偿位移；需统一行高、唯一key、懒加载及预处理数据。467 收藏 -
要。HTML是唯一合规基础，需分层披露、语义化标签、明确主体、可访问可存档，避免隐藏、模糊指代与前端链路断裂。487 收藏