-
最安全的高亮做法是用textContent提取纯文本，再用document.createElement('mark')包裹匹配片段并replaceChild替换；过滤时应统一转小写比较，多词搜索需拆分后逐个命中，超200条数据要加防抖。
-
newService()是解耦的第一道坎，因其将调用方与具体实现硬编码绑定，导致替换、拦截或测试时需修改所有构造点；应通过工厂函数统一创建并注入实例，切断隐式耦合。
-
HTML仅定义语义结构，CSS才负责排版；布局应基于display:flex/grid而非HTML标签，统一box-sizing:border-box避免盒模型误差，且父容器必须显式设置display属性才能启用子元素的布局指令。
-
animation-play-state仅对CSS@keyframes动画生效，无法控制JS动画；需确保元素已声明animation（非none且duration>0）；JS中须用驼峰写法animationPlayState；推荐class切换而非内联样式；暂停时样式保持、CPU降低，但不支持指定帧暂停。
-
本文详解为何button:disabled无法覆盖ID选择器样式，揭示CSS特异性（specificity）机制，并提供兼容性强、语义完整、无障碍友好的禁用状态样式方案。
-
浮动图片导致父容器高度塌陷，推荐用display:flow-root解决，其次clearfix，overflow:hidden仅适用于无溢出风险场景。
-
ping属性在链接跳转上报中常失效，因其依赖CORS配置、同协议（仅HTTPS有效）、页面未关闭等隐性条件，Chrome94+更静默禁用HTTP环境下的ping，且不具备送达保障。
-
表单反馈信息需在正确时机、方式和位置响应，应紧邻对应控件放置于label后或同级span中，同步控制display:none与aria-hidden="true"/tabindex="-1"，动态字段需实时联动required状态并服务端兜底校验。
-
要让::after伪元素居中，需在父元素设text-align:center并使伪元素为display:inline-block；若用flex布局，则父元素设display:flex并配合justify-content和align-items。
-
IIFE的“自我销毁”实为隔离+单次+清理：通过作用域隔离防全局污染，主动清理异步资源，标记防重入，内联依赖并解耦宿主环境。
-
JavaScript中对象创建应按需选择：字面量适合单例和静态数据，构造函数/class适用于多实例、方法复用与封装，工厂函数则提供无new的可控创建方式。
-
能，Svelte中顶层<style>标签默认启用作用域隔离，样式仅影响当前组件内元素；编译时自动为元素和选择器添加唯一哈希属性（如svelte-123abc），确保不泄漏。
-
媒体查询必须配合正确的viewport标签才能生效，正确写法是<metaname="viewport"content="width=device-width,initial-scale=1.0">，断点应由内容实际错乱位置决定，优先使用min-width和相对单位，布局推荐flex或grid。
-
Map不是状态管理工具，而是用于数据映射与解耦的轻量载体，支持对象/Symbol作键、插入顺序保障，适用于缓存索引、运行时注册表、局部快照桥接等场景，可实现细粒度状态隔离与低开销中间层构建。
-
autoplay必须与muted配合才生效，controls控制原生控件显示，muted影响初始音量，preload仅为提示，loop在iOS全屏下需playsinline才有效。
