-
树形展示必须用JavaScript控制展开逻辑，纯HTML的ul/li无法实现交互式折叠；details/summary仅适用于单层简单场景；真实项目应采用轻量JS+CSS类名驱动，并完善键盘导航与无障碍支持。
-
JavaScript调用RESTAPI应使用fetch+async/await，手动检查response.ok或status，try/catch捕获异常；封装apiClient统一处理token、序列化、超时及错误；UI需响应加载、错误、空状态；URL应常量化管理。
-
JavaScript正则匹配核心是test()判断存在性、match()/exec()提取内容；优先用includes()/indexOf()替代；注意转义特殊字符、标志作用及贪婪控制。
-
Promise有pending、fulfilled、rejected三种状态，状态一旦改变不可逆；2.通过then方法注册回调并返回新Promise实现链式调用；3.回调异步执行，使用queueMicrotask模拟微任务；4.resolvePromise函数处理then返回值，若为Promise则递归解析，否则直接resolve；5.需防止循环引用和多次调用，确保错误冒泡。
-
直接用rotate()做菱形容易错位，因为默认以左上角为旋转原点，需显式设transform-origin:center；父容器须为等宽高等尺寸的正方形并加overflow:hidden，配合45deg旋转才能实现全对称菱形。
-
底部固定布局不能仅用position:fixed因会脱离文档流导致遮挡，需用flex布局：父容器min-height:100vh、display:flex、flex-direction:column，主内容区设flex:10auto，底部保持默认不伸缩。
-
SVG仪表盘刻度必须与指针共用同一角度映射公式，即θ=startAngle+(val−minVal)/(maxVal−minVal)×(endAngle−startAngle)，否则视觉错位；刻度线用<line>从圆心出发计算端点，数字标签需绕圆心旋转并设text-anchor和dominant-baseline对齐。
-
HTML原生color输入框轻量但受限，仅支持#rrggbb格式且无透明度；HSL滑块可控性强但缺色盘直观性；CanvasHSV色盘最专业但开发成本高；表单集成需处理初始值、重置同步与无障碍。
-
需用@font-face引入自定义字体，优先WOFF2格式并提供多格式回退；通过font-family调用，建议加通用字体兜底；可用CSS变量统一管理族名；注意CORS跨域限制及font-display:swap优化加载体验。
-
muted是视频自动播放的必要条件，必须在HTML中与autoplay同时声明，且移动端需加playsinline；仅设autoplay必失败，因浏览器按有声无交互拦截；JS后设muted无效，失败后须捕获并提供播放按钮。
-
position:absolute元素的top/left位移不触发transition，应改用transform（如translate、scale）和opacity配合实现居中淡入滑入动画，避免使用transition:all，确保元素已渲染且状态明确。
-
本文介绍如何使用jQuery的animate()方法为固定定位侧边菜单添加平滑的左右滑动动画，替代生硬的display显示/隐藏切换，提升用户体验。
-
grid-template-areas在RTL下顺序不变，因其按字符顺序解析而非逻辑方向；需用justify-content:start等逻辑属性对齐，或为[dir="rtl"]单独重定义区域。
-
fade()直接设置目标透明度，fadein()在原alpha上叠加不透明度；前者用于精确控制，后者适用于已有透明色的微调。
-
本文解析JavaScript中表单输入值在提交时为undefined或空字符串的根本原因——变量在页面加载时即静态读取了空输入框的初始值，而非在提交时动态获取；并提供规范、可复用的解决方案。
