-
GSAP的Timeline可精确控制动画时序，通过位置参数实现串联、延迟、重叠；支持播放、暂停、倒放、跳转等交互控制，并可用标签提升复杂动画的可维护性。
-
推荐用data-ext属性存小写后缀并配合[data-ext$="pdf"]选择器，避免href路径干扰；图标用::before+content插入字体图标或Unicode，需设display和font-size；注意大小写敏感，JS提取后缀时应转小写。
-
普通函数直接调用时，非严格模式下this指向全局对象（如window），严格模式下为undefined；箭头函数无this，继承外层作用域；call/apply/bind可手动指定this，bind返回的新函数this不可再被call/apply更改；对象方法赋值后调用会丢失this绑定；new调用时this指向新创建的实例。
-
主题颜色变量未生效的四大原因：变量定义位置错误、构建流程未读取新配置、CSS选择器权重不足、运行时主题切换未清除旧样式缓存，需逐一排查。
-
CSScolumns实现瀑布流轻量易维护，但属按列顺序切割的“伪瀑布流”，适合内容长度相近场景；需用column-count与column-gap控制列数和间距，子项加break-inside:avoid防断行，图片设aspect-ratio或padding-top避重排，响应式推荐column-width结合column-count限制上限。
-
atob解码Base64配置流仅完成字节还原，后续需显式清洗、UTF-8重建、JSON解析及安全映射；服务端必须确保UTF-8编码全流程，前端须清理前缀/字符并用TextDecoder转义，再异步注入校验后的配置。
-
==会偷偷改数据类型，因其先进行隐式转换再比较值，如null==undefined为true、'0'==false为true；===则严格先判类型再比值，避免意外转换，是日常开发首选。
-
使用开发者工具精准定位HTML代码片段有五种方法：一、元素面板搜索；二、Sources面板全局源码搜索；三、控制台执行DOM查询语句；四、Searchacrossallsources快捷入口；五、DOMBreakpoints定位动态插入内容。
-
移动端页脚分栏不堆叠需设flex-wrap:wrap并用max-width:768px断点；Grid响应式应使用grid-template-columns:repeat(auto-fit,minmax(200px,1fr))，避免auto-fill和height:100vh。
-
伪类是描述元素特定状态的CSS关键词，:hover需元素可交互且支持悬停（如非移动端、pointer-events:auto），:focus匹配所有焦点来源而:focus-visible仅限键盘导航意图，伪类顺序应遵循LVHAF规则以确保样式正确生效。
-
JavaScript中尚无原生Set.prototype.intersection()方法，它处于Stage3提案阶段，Chrome/Firefox实验性支持但需开启flag，Safari和Node.js默认不可用；推荐用O(n+m)时间复杂度的手动实现，并预留原生方法降级兼容逻辑。
-
left:var(--offset)不会触发过渡，因CSS变量非可动画值；必须用calc(var(--offset))包裹并配合transition才能实现平滑位移。
-
原型共享的核心是将方法挂载到构造函数的prototype上，使所有实例通过proto链共享同一份方法；实例自身属性优先于原型属性，删除实例属性后原型方法自动生效。
-
内联样式权重最高是规范强制设计，不参与选择器权重计算而直接生效；唯一合法覆盖方式是外部样式中带!important且能命中元素。
-
遮罩层需用background-color:rgba(0,0,0,.7)而非opacity，配合z-index分层控制显隐，添加touch-action:none和100vh/100vw尺寸，并在iOS中动态控制bodyoverflow与overscroll-behavior。
