-
真正的防御必须从「锁定目标」和「识别模式」开始：只监听支付按钮、登录表单等关键容器，配置childList+subtree+attributes（限class/style/hidden），回调中快速筛检高危变更，修复前必disconnect，且需配合load事件等补位document.write等绕过场景。
-
SCSS中不能直接用变量调用rgba($r,$g,$b,$a)，应使用内置rgba($color,$alpha)函数或rgb()配合；mix()可替代实现视觉淡色效果，避免opacity对子元素的全局影响。
-
Promise是JavaScript中处理异步操作的对象，代表未来完成或失败的结果；具有pending、fulfilled、rejected三种不可逆状态；通过newPromise创建，支持链式调用、错误捕获及Promise.all等静态方法。
-
CSStransition对颜色插值默认采用RGB空间线性计算，即R、G、B三通道各自独立按时间比例插值，不感知人眼视觉均匀性；如#ff0000→#0000ff中途得#800080，而#ff0000→#00ff00会经过灰褐调的rgb(128,128,0)；目前无浏览器在transition中原生支持LCH/OKLCH插值，仅@keyframes（Chrome112+/Safari16.4+）在全用同色函数时才启用LCH空间插值。
-
clearfix必须用::after而非::before，因其作为最后“视觉子节点”设clear:both才能截断浮动流；content:""不可省略，否则伪元素不渲染；height:0和visibility:hidden缺一不可，分别控制空间占用与可见性交互；flow-root可替代但兼容性有限，旧版Safari及全部IE不支持。
-
目前无法通过CSS伪类如::picture-in-picture-volume直接控制画中画（PiP）模式下音量条的样式，因为PiP窗口的UI由浏览器原生实现且出于安全、用户体验一致性和技术复杂性考虑被严格限制自定义；开发者只能通过JavaScript操作源视频元素的volume属性来间接控制音量，或依赖系统级音量调节，同时可在网页内构建自定义播放器界面，将音量控制与PiP按钮集成，从而在进入PiP前提供良好体验，确保用户无论通过网页控件还是操作系统功能都能有效调整音量，最终实现对PiP音量的全面管理。
-
grid-item的box-shadow被父容器裁剪的根本原因是grid-container默认overflow:hidden且未创建新层叠上下文，导致不占布局空间的阴影被剪切；解决方法包括设overflow:visible、加padding、用transform创建新层叠上下文等。
-
屏幕阅读器正确读出图标按钮含义的关键是提供清晰语义化的文本替代信息：优先使用aria-label直接标注操作意图，如“分享到微信”；其次可用aria-labelledby关联隐藏可见文本；禁用title和CSS伪元素；按钮必须为原生可交互元素。
-
答案：GSAP适合高性能动画，Three.js用于3D图形，Phaser专攻2D游戏，PixiJS侧重轻量渲染，合理组合可提升开发效率。
-
使用两个inputtype="date"并结合JavaScript动态设置min属性，可确保结束日期不早于开始日期，同时推荐使用Flatpickr等库提升体验，并在后端校验数据；时区处理建议前端用ISO格式传参，后端统一用UTC存储，展示时再按用户时区转换。
-
navigator.clipboard.read读不到图片和HTML是因为浏览器默认仅支持text/plain，其他类型需显式申请clipboard-read权限并用户授权；API返回ClipboardItem列表，须手动调用getType()解析，且各浏览器兼容性差异大（Chrome/Edge支持较全，Safari不支持图片，Firefox不支持read）。
-
indexOf是最简站内搜索方案，适合静态页；需trim()和toLowerCase()预处理、遍历节点匹配、转义正则字符；matchAll比match更适高亮因含位置信息；input防抖须清定时器并区分空搜；内容少时无需lunr.js等重型库。
-
calc()是CSS函数，必须写在CSS声明中（如style属性或样式表），且加减号前后必须有空格；不能用于HTML属性，乘除法无空格要求但单位规则更严，嵌套实为括号，推荐用自定义属性拆分复杂计算。
-
纯HTML+CSS无法实现可交互音乐卡片，必须使用<audio>元素并配合JavaScript控制播放、进度、状态等；<audio>是HTML5唯一标准方案，支持多格式，需设src或<source>，preload="metadata"优化体验，自定义UI须隐藏原生控件并用JS绑定事件与DOM操作。
-
本文详解如何通过合理设置定位与CSS变换，使子元素（如.inner-inner-circle）在父容器内平稳旋转而不溢出，重点解决transform:translateY()导致脱离父级边界的问题。
