localstorage 可持久化保存夜间模式与皮肤偏好，通过 setitem 存储字符串主题值或 json 对象，页面加载时 getitem 读取并应用 class 或 css 变量，结合 matchmedia 响应系统主题变化，辅以 try-catch 兼容异常场景。
LocalStorage 可以轻松实现夜间模式和皮肤偏好（如深色/浅色主题、自定义配色）的本地持久化，核心是把用户选择存进 localStorage，并在页面加载时读取并应用。
保存用户偏好到 localStorage
当用户点击切换夜间模式或选择皮肤时，把当前状态写入 localStorage：
- 用
localStorage.setItem('theme', 'dark')存储主题类型（如'light'、'dark'或自定义值如'blue'） - 若需同时保存多个设置（如背景色、文字色），可封装为对象再转成 JSON：
localStorage.setItem('skinPrefs', JSON.stringify({ theme: 'dark', accent: '#4a6fa5' })) - 避免直接存布尔值（如
true），统一用字符串更稳妥，防止类型混淆
页面加载时读取并应用偏好
在 JS 初始化阶段（如 DOMContentLoaded 后）读取并生效：
Ai Coach Batch Session Summary
下载
批量分析录音转写，输出多维度拓客报告。触发词：录音分析、总结、音频总结、拜访记录总结。当用户提及「分析录音」「看看录音数据」「最近的录音」「通话记录」且意图为批量统计/分析时触发。仅出现「录音」或「拜访」时需结合上下文，若仅查看单条详情则不触发。
- 先尝试读取：
const savedTheme = localStorage.getItem('theme') - 若存在且合法，就给
或添加对应 class：document.documentElement.classList.add(savedTheme) - 配合 CSS 变量或 class 切换样式，例如：
.dark { --bg: #121212; --text: #e0e0e0; } - 若未找到，则按系统偏好或默认主题 fallback：
window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light'
监听系统主题变化并同步更新
用户可能在系统级切换深色模式，网页应响应：
- 用
window.matchMedia('(prefers-color-scheme: dark)')监听变化 - 回调中判断是否需要更新 localStorage 和页面样式（比如用户没手动设置过，才跟随系统）
- 示例逻辑：
if (!localStorage.getItem('theme')) {<br> const systemDark = e.matches;<br> applyTheme(systemDark ? 'dark' : 'light');<br>}
注意兼容性与清理边界
确保行为稳定可靠：
- localStorage 在无痕模式或禁用 JS 时可能不可用，加 try-catch 包裹读写操作
- 用户清除浏览器数据后偏好丢失是预期行为，无需额外处理
- 避免频繁写入（如每秒存一次），只在用户主动切换时保存
- 若支持多端同步，localStorage 不够用，需搭配服务端或 IndexedDB
Java免费学习笔记：立即使用
解锁 Java 大师之旅：从入门到精通的终极指南
