-
CustomEvent构造函数创建自定义事件需传入事件名和含detail属性的配置对象，detail为必需字段用于携带任意数据；通过dispatchEvent触发，addEventListener监听时通过event.detail读取数据；可选bubbles、cancelable等配置控制事件行为。
-
Provide适合局部树内隔离状态，Pinia适合跨组件需调试持久化的全局状态；二者互补协同，按状态生命周期归属选择：长期有意义归Pinia，仅模块内有效归Provide。
-
正则表达式可初筛Hardcoded字符串，但需结合上下文判断真伪；推荐AST解析或专业工具（如Semgrep、SonarQube）提升准确率。
-
styled-components的样式注入不发生在每次渲染，而是在组件挂载或主题变更时检查并按需插入；动态插值绑定React渲染周期，导致运行时计算开销显著高于构建时处理的CSSModules。
-
使用ID选择器最合适的情况包括：1.唯一标识元素时，如导航栏、页脚等全局唯一区域；2.需要提升样式优先级时，因ID选择器权重高于类和元素选择器；3.布局结构中作为主要模块标识，有助于SEO和无障碍访问；4.谨慎使用以避免滥用导致维护困难。因其高优先级和唯一性，适用于JavaScript操作及特定样式锁定，但应避免过度依赖以保证样式的复用性和项目的可维护性。
-
WebWorker是浏览器中实现JavaScript多线程的唯一标准机制，通过异步消息传递通信，运行于独立上下文，不支持DOM、window等API，需遵循结构化克隆、同源限制、显式错误处理等规范。
-
JavaScript创建对象无唯一正确方式，需据场景选择：字面量适合单例配置，构造函数/class适用于多实例共享方法，Object.create()用于精细原型控制，工厂函数则灵活支持私有变量和模块化。
-
按钮点击区域偏移主因是absolute定位时未校准padding对热区的影响，应检查定位基准、用transform替代top/left、加outline验证热区，并统一box-sizing:border-box。
-
dfn标签仅在术语首次出现且紧邻完整定义语句时使用，必须嵌套于语义化块级元素中，优先取title属性值作为定义内容，错误用法会导致语义断裂与辅助技术失效。
-
HTTPS页面加载HTTP资源会被现代浏览器默认阻止，主动混合内容（如script、iframe）直接报错阻断，被动内容（如img）在Chrome94+也统一阻止；应将所有http://替换为https://，并检查API、第三方SDK及构建流程。
-
用position:absolute+top:0+left:0+width/height:100%使图片叠于父容器左上角，父容器需设position:relative和明确高度，配合z-index与opacity切换，预加载图片并用object-fit:cover防变形。
-
后端收不到字段八成是误用disabled而非readonly；disabled使字段值不提交，readonly则正常提交且支持聚焦复制；select等不支持readonly的元素需用替代方案。
-
button:active无反应主因是未触发重绘或被父容器裁切，需设position:relative、禁用overflow:hidden并添加transition；移动端需用原生button或role="button"+tabindex，配合viewport设置或touch事件模拟。
-
fetch“成功”指网络通信完成而非业务正常，404/500等状态码仍会resolve；需用res.ok判断业务失败，网络错误才reject。
-
Flex子项margin-top/bottom“穿透”父容器是因Flex容器未形成BFC导致外边距塌陷；解决方法是给容器加overflow:hidden/auto创建BFC，或用padding替代margin，优先使用gap控制子项间距。
