-
本文详解如何在React多题型测验应用中，为每个问题的选项实现独立、互斥的背景高亮——即用户点击某选项时仅该题内该选项变色，其他题目不受影响，且同一题内再次点击不同选项时自动取消前一个高亮。
-
通过CSStransition结合font-size可实现文字大小平滑过渡。设置初始字号、指定过渡时间与缓动函数，利用:hover、:focus或JavaScript触发变化，注意避免布局重排并适配移动端，提升用户体验。
-
Vue3推荐使用模板而非Render函数，因其可被编译器静态分析并生成优化的BlockTree，实现细粒度更新；而Render函数为运行时JavaScript，无法参与Block构建，导致更新退化为传统vnodediff。
-
float多栏布局必须手动计算总宽度（含margin、padding、border）≤100%，否则末栏换行；需用box-sizing:border-box、留1–2px余量、父容器padding要扣除；clear:both或overflow:hidden防塌陷；IE8兼容需整数百分比或条件注释。
-
JavaScript处理JSON核心靠JSON.parse()和JSON.stringify()，但需注意：JSON格式严格（键名双引号、无尾逗号/注释/undefined/函数），解析须try...catch；stringify会忽略函数/undefined/Symbol等；fetch的.json()返回Promise需await；循环引用会报错，可用replacer临时绕过或structuredClone。
-
CSS样式优先级按四元组（a,b,c,d）计算，内联样式＞ID＞类/伪类＞元素，!important覆盖同源无!important规则；可用开发者工具、getComputedStyle、Computed面板及禁用规则法排查。
-
按钮组合的本质是布局约束与状态隔离，需通过flex/grid容器、position:relative包裹、gap替代margin、同步控制pointer-events与tabindex等实现可靠交互与可访问性。
-
弹性布局内容溢出本质是子项过度压缩或缺最小宽度，应通过flex-shrink权重调控、min-width设安全底线、flex-basis定初始尺寸及文字截断/换行处理协同解决。
-
grid-auto-columns用于设置网格容器中隐式创建的列的宽度。当子元素被定位到未显式定义的列时，浏览器会自动生成隐式列，默认宽度为auto；通过grid-auto-columns可统一控制这些列的宽，支持固定值、百分比、fr单位及min-content等取值；常与grid-auto-flow:column配合实现横向自动布局，适用于轮播图、动态卡片等场景；结合minmax()和媒体查询可提升响应式灵活性，且仅影响隐式列，不影响已定义的列轨道。
-
JavaScript生成器函数是能暂停和恢复执行的特殊函数，通过function*定义，返回迭代器对象，调用next()运行至yield并返回{value,done}结构，支持双向通信与惰性求值。
-
表单action未生效通常因前端未触发提交行为，如button缺少type="submit"或未调用event.preventDefault()；action仅决定提交地址，空字符串表示提交至当前URL；相对路径易受路由影响，推荐绝对路径如"/api/submit"。
-
前端路由通过Hash或History模式实现SPA页面切换。Hash模式兼容性好但URL不美观；History模式URL简洁利于SEO，但需服务器配置支持。
-
Vue异步更新队列将多次数据变更合并为一次DOM更新，nextTick在patch完成后、浏览器渲染前执行微任务回调，patch由队列统一触发虚拟DOM比对与更新。
-
JavaScript解析器分阶段执行代码，因引擎需先语法分析和编译，采用“预解析+懒编译”策略：函数声明预解析但主体懒编译，箭头函数赋值时仅语法检查，class定义时即全量编译，eval/newFunction强制同步编译。
-
用CSSGrid可精准还原蒙德里安式非对称平衡网格，需手动定义行列尺寸（如200px1fr300px），禁用repeat()均分；色块为独立div平涂纯色，黑线亦为独立色块；慎用vw，推荐clamp()维持比例；务必清除所有冗余间距与样式。
