data-i18n属性需显式添加到所有可翻译位置，包括placeholder、title、alt等带后缀的属性；语言包须按规范路径和扁平键名组织；切换语言需同步更新document.lang、相关lang属性及localStorage；动态插入节点须手动调用翻译函数。
data-i18n 属性必须显式加在所有可翻译位置
只给 <h1 data-i18n="home.title"> 加属性远远不够。placeholder、title、alt 这些属性不会被 textContent 更新，漏掉就永远显示旧语言。
必须按需使用带后缀的属性：
<input data-i18n-placeholder="search.hint"><button data-i18n-title="btn.save"><img data-i18n-alt="logo.desc">
value 一般跳过处理——它是用户输入数据，不是界面文案；<script>、<style>、<pre> 内部不渲染可见文本，加 data-i18n 无效。
JSON 语言包结构和加载必须严格对齐
每个语言一个文件，路径统一为 ./locales/${lang}.json，比如 ./locales/zh-Hans.json、./locales/en-US.json。键名必须扁平、全小写+下划线（nav_home ✅，navHome ❌），且所有语言文件键名完全一致。
立即学习“前端免费学习笔记（深入）”；
加载失败时页面不会报错，只会显示原始 key（如 form_submit），因为 JS 默认 fallback 到 undefined。必须主动兜底：
将 Markdown 文章转换为微信公众号兼容的纯 HTML 格式。当用户要求"转成微信格式"、"生成公众号文章 HTML"、"排版到微信草稿箱"、"微信粘贴格式"时触发。输出带内联样式的纯 HTML，微信编辑器可直接渲染，无需额外适配。支持标题、段落、列表、粗体、行内代码、表格、引用块、代码块、配图的完整转换。
- 用
try/catch包裹整个fetch()和.json()流程 - 检查
response.ok和response.headers.get('content-type')?.includes('application/json') - 某语言暂未翻译的项，也要保留键并设为空字符串：
"btn_submit": ""，不能删键
切换语言时必须同步更新三处 DOM 语义
只替换文字是假切换。屏幕阅读器、字体回退、SEO 都依赖 lang 属性，而它不继承，只看每个元素自己的值。
一次切换必须同时做三件事：
- 设置
document.documentElement.lang = 'ja'（注意短横线，不是下划线） - 遍历所有已存在的
[lang]元素，只更新那些“本该随主语言变”的（如<p lang="en">是引文，应跳过；<div lang="zh">是主内容，要重设） - 执行
localStorage.setItem('lang', 'ja')—— 必须在语言包加载完成、DOM 更新完毕后才写，否则刷新可能拿到未就绪状态
动态插入节点必须手动触发翻译
AJAX 加载的弹窗、表格行、懒加载模块，插入 DOM 后不会自动生效。JS 不会监听 DOMNodeInserted（已废弃），也没法靠 MutationObserver 自动识别 data-i18n。
正确做法是：节点插入后立即调用翻译函数，例如：
const el = document.createElement('div');
el.innerHTML = '<button data-i18n="modal.confirm"></button>';
container.appendChild(el);
translateElement(el); // 手动触发
IE11 兼容性也得注意：el.dataset.i18n 会失效，必须用 el.getAttribute('data-i18n') 兜底。
最易被忽略的是：语言包键名与 HTML 中 data-i18n 值大小写/分隔符不一致，或 JSON 文件 MIME 类型不对（非 application/json），这两处一出错，整页就静默 fallback 成 key 字面量——连控制台都不报错。
