-
history.pushState()新增历史记录，适合导航跳转；replaceState()替换当前记录，适合修正URL而不留返回点；二者均需配合popstate监听及服务端配置防404。
-
浮动元素的排列顺序由DOM结构主导，HTML中先出现的元素在浮动时优先排列，CSS的float属性仅控制左右方向，无法改变这一顺序。
-
图片在CSS网格中拉伸变形的主因是容器尺寸固定而图片未受控缩放，解决关键是用object-fit控制缩放方式，并确保父容器尺寸合理、图片自身不被错误设宽高。
-
本文详解如何通过调用天气API获取实时温度数据，并基于温度值自动切换网页背景颜色，涵盖异步请求、数据解析、条件判断与DOM操作全流程。
-
本文详解如何通过调整transition-delay值，实现多个元素在悬停进出时按指定顺序逐个展开/收起，尤其适用于倒序收起（如从最后一个元素开始“折叠”）的交互动画效果。
-
必须在表单submit事件中调用event.preventDefault()阻止默认提交，仅监听form元素的submit事件；利用checkValidity()和reportValidity()进行原生约束验证，setCustomValidity()处理业务逻辑验证，服务端必须重新校验。
-
CSS变量需以--开头、大小写敏感，定义在:root可全局复用；支持深色模式通过@media或class重写；var()支持字面量回退值但不支持嵌套var()；IE不支持需fallback或构建时处理。
-
sticky定位结合relative与fixed特性，设置如top值后元素在滚动至临界点时固定于视口，常用于表头、导航栏等场景，需注意必须指定偏移量且父容器足够高，否则无效。
-
箭头函数与传统函数最核心区别是this绑定方式不同：箭头函数this词法绑定、不可变，无arguments、不能new调用、无prototype；传统函数this动态绑定，支持arguments、new及call/apply/bind。
-
绝对定位元素脱离父容器是因为父元素未设置非static定位，导致其相对于最近的已定位祖先或视口定位；解决方法是为父元素设置position:relative等非static值，以建立定位上下文，使子元素正确相对于父容器定位。
-
五角星需用canvas通过极坐标转直角坐标计算5个顶点，按0→2→4→1→3→0顺序连线；先设中心(cx,cy)和半径r，角度从-π/2开始，用cos/sin算坐标，再moveTo+lineTo绘制并stroke/fill。
-
完全可靠，这是最常用也最稳妥的方式；只要侧边栏有明确类名或ID，在移动断点内设display:none即可彻底移除渲染、不占布局、无障碍阅读器跳过。
-
使用margin和gap调整卡片间距，.card设置margin-bottom并清除最后一项，推荐flex或grid布局用gap自动分配间距，grid支持行列不同gap，注意避免margin与padding叠加，统一box-sizing，移动端用rem适配。
-
边缘计算结合JavaScriptCDN通过将计算任务下沉至离用户更近的边缘节点，并利用CDN全球网络加速JS资源分发，实现动静态内容的高效处理。1.边缘节点可执行轻量级逻辑（如身份验证、A/B测试），减少回源延迟；2.JavaScriptCDN缓存常用库（如React、Vue），提升加载速度；3.典型应用包括动态内容注入、前端优化、安全防护和流量分流；4.主流平台如CloudflareWorkers支持在边缘运行JS并集成KV存储实现配置实时更新；5.需注意边缘资源受限、调试复杂及缓存更新策略等问题。该架
-
Treeshaking是打包工具的静态分析优化，只保留实际使用的ES模块代码；对CommonJS无效，需用lodash/debounce或lodash-es等ESM兼容方案，并满足type:"module"、mode:'production'及规范导出形式。
