-
用background-image配合linear-gradient是唯一靠谱方案：CSS无原生动态渐变，需JS控制CSS变量或切换class触发动画，避免频繁修改内联样式；推荐用HSL插值、避开iOSfixed渲染Bug。
-
使用开发服务器或构建工具可实现HTML代码与页面实时同步。一、安装Node.js后通过npm全局安装lite-server，配置bs-config.json并启动服务，保存文件后浏览器自动刷新；二、在Chrome开发者工具中启用LocalOverrides功能，将修改的HTML结构保存至本地磁盘，实现持久化同步；三、使用Vite等现代构建工具，初始化项目后运行开发服务器，编辑器保存代码即触发浏览器自动更新。
-
逻辑赋值运算符&&=、||=、??=可简化条件赋值：1.&&=在左侧为真值时赋值，适用于有值才更新；2.||=在左侧为假值时赋值，常用于设置默认值；3.??=仅当左侧为null或undefined时赋值，避免覆盖0或空字符串等合法值，提升代码安全性与可读性。
-
创建HTML文本框使用<inputtype="text">，通过name、value、placeholder、maxlength等属性设置名称、默认值、提示文字和输入限制，并可结合form表单提交数据。
-
closed模式无法真正隐匿逻辑，因其仍可通过getComputedStyle、slotchange事件、MutationObserver等间接推断内部结构，且易被原型劫持；open模式才是可调试、可测试、符合工程实践的合理选择。
-
应使用window.matchMedia异步监听系统主题切换：先获取MediaQueryList实例并立即设置初始UI策略，再通过addEventListener绑定change事件处理函数，避免废弃API；渲染逻辑需解耦、轻量、节流；组件卸载时必须移除监听器；SSR环境需判断window存在性；不支持时降级为localStorage或轮询。
-
Vue3的setup中不可用$filters，因其是Vue2实例属性且全局过滤器已被弃用；推荐改用纯函数封装（如formatDate）、模块导出并在setup中直接导入使用。
-
Vue初始化性能优化的关键是用v-if延迟非核心组件渲染，因其在false时不创建实例、不编译模板、不触发生命周期和API请求，相比v-show更彻底；适用于模态框、详情抽屉、权限模块及复杂图表等场景。
-
requestIdleCallback可在主线程空闲时执行低优先级任务，如埋点上报、预加载，比setTimeout更精准，但需兼容Safari16.4+；应缓存DOM查询结果、避免生产环境console.log、慎用JSON.parse(JSON.stringify())深拷贝。
-
::placeholder伪元素用于自定义输入框占位符样式，支持color、font-size等属性，可针对不同输入框设置，并建议添加厂商前缀以兼容旧版浏览器。
-
必须用标签而非CSS模拟，因其原生支持语义正确、浏览器自动适配字体基线、保障屏幕阅读器准确朗读，适用于化学式（如H₂O）、数学公式等需精确对齐与无障碍访问的场景。
-
VueRouter4弃用next()是为转向声明式返回，通过返回值（true/字符串/false/错误）明确导航意图，解决VueRouter3中回调式next()的遗漏、重复、嵌套和语义模糊问题。
-
ol标签自动编号失效的常见原因包括：li未作为ol直接子元素、list-style被设为none、嵌套结构错误、空ol在旧浏览器中不渲染；start控制起始值而非跳过项，reversed仅改变编号方向不改变DOM顺序，value仅影响当前li且后续仍递增。
-
entries()方法返回一个迭代器对象，用于遍历数组的索引和值组成的键值对，1.调用arr.entries()返回迭代器而非数组，需通过for...of或next()方法访问；2.每次next()调用返回包含value（键值对）和done（是否结束）属性的对象；3.实际应用包括同时获取索引和值（如生成带索引类名的HTML）、简化数据处理逻辑及与其他迭代方法组合使用；4.相比for...in循环，entries()仅遍历数组元素而不包括自定义或继承属性，避免意外输出，更安全可靠。
-
使用Flexbox可高效创建响应式图片画廊。1.建立包含多个.item子项的.gallery容器；2.设置display:flex与flex-wrap:wrap，实现项目自动换行并用gap控制间距；3.通过flex:11250px等设置让项目可伸缩，适配不同屏幕；4.结合媒体查询，在768px和480px断点下调整item尺寸，实现多设备兼容布局。
