-
使用<nav>标签构建语义化导航，结合CSS美化与JavaScript实现响应式交互，并通过ARIA属性和描述性链接文本提升可访问性与SEO。
-
CanvasAPI不提供开箱即用的绘图交互，需手动管理鼠标状态、路径绘制与撤销逻辑；关键在连点成线、正确使用beginPath()/moveTo()/lineTo()，撤销需保存操作指令或双canvas缓存，导出图片须注意跨域、像素尺寸与格式参数。
-
Chrome中font-smoothing无效是因-webkit-font-smoothing仅macOS有效，Windows/Linux下被静默忽略；应优先使用font-optical-sizing:auto等标准属性，而非依赖私有平滑控制。
-
需通过系统化手段解析HTML结构：一、用开发者工具查看DOM树；二、识别语义化标签与容器边界；三、借助CSS选择器反向推导层级；四、运行JS脚本遍历输出层级；五、利用第三方工具生成可视化结构图。
-
for循环比forEach和map快，因其是原生语句、无函数调用开销、可缓存长度、支持break/continue；而forEach/map有回调开销、闭包、上下文绑定及新数组分配等成本。
-
用padding-left做嵌套缩进而非margin-left，因其保持父容器事件热区完整、确保hover/click/touch全区域响应；配合CSS变量、clamp()与border-box可控层级、对齐及响应式。
-
用transform:rotate()配合transition和JS控制替代纯CSSanimation，动态计算目标角度、校准扇区中线、强制重绘并状态锁控，可实现精准、不卡顿、防连点的转盘抽奖。
-
应使用<time>标记时间线变更点，其datetime属性须为ISO8601格式（如2024-03-15），内容可为人类可读文本；多个变更点需多个<time>标签，辅以data-version等自定义属性标识版本；“前后对比”需用语义化容器（如<divclass="versionold/new">）配合<del>/<ins>标记小范围文本差异，禁用title或注释替代可见记录。
-
Svelte要求HTML标签全小写、自闭合标签显式闭合、事件用on:click绑定、插值仅支持表达式、逻辑用{#if}和{#each}块；style属性需移至scopedstyle块或加global修饰。
-
align-items:stretch是Flex子项默认等高的关键，只要未显式修改且子项无固定height/min-height，它们会自动拉伸填满交叉轴；需配合min-height:0和box-sizing:border-box确保嵌套与盒模型正确。
-
最直接的方式是用document.getElementById()获取元素再取内容或属性：先通过ID定位元素，再用.textContent、.innerHTML或.getAttribute()读取内容或属性。
-
ContainerQueries是组件级响应式方案，需容器设container-type并建立BFC，折叠屏下须动态viewport、防尺寸跳变、避免flex/grid子项直接查询。
-
静态方法属于类本身，通过类名调用，无需实例化，用于工具函数、工厂方法等场景。
-
JavaScript中Set用于存储唯一值，可一行实现字符串字符去重（如[...newSet('abac')].join('')→'abc'）或字符串数组去重（如[...newSet(arr)]），支持预处理实现忽略大小写/空白的语义去重，搭配Map还可统计频次。
-
:nth-child(2n)选不到目标行是因为它按父元素下所有子元素的物理顺序计数，不区分标签类型；若存在thead、tbody或div等干扰节点，序号即错乱。
