页面语言声明是否符合国际化标准，关键在于每个含文本元素是否显式设置合法bcp 47格式的lang属性，而非仅依赖html根节点声明；浏览器和屏幕阅读器不继承根lang，须逐元素验证，动态内容插入后也需立即补设。

页面语言声明是否符合国际化标准，不能只看 写没写，而要验证它是否真实生效——即浏览器、屏幕阅读器、字体回退、标点渲染等行为是否按预期响应。关键在于：根节点声明只是起点，真正起作用的是每个含文本元素自身的 lang 属性。

检查所有语义化文本元素是否显式带 lang

浏览器和辅助技术（如 VoiceOver、NVDA）**不继承** document.documentElement.lang，而是逐个读取每个元素的 lang 属性。漏掉任何一个，就可能出问题。

• 必须覆盖的标签：

  –

  、

  、

  、

  、

  、

  、、、、

  值必须合法：严格使用 BCP 47 格式，例如 zh-Hans（非 zh_CN 或 zh），ja-JP（非 ja），ar-SA

  局部多语言必须显式标注：比如中文页中嵌入法语引文，要写 <blockquote lang="fr">Merci</blockquote>，不能靠父级继承

  用 JavaScript 验证 lang 属性是否同步更新

  切换语言时，仅改 document.documentElement.lang 是无效的。测试脚本必须检查 DOM 中每个相关元素的属性值是否已更新。

  

  Html2md

  使用 Readability + Turndown 将 HTML 页面转换为干净的、Agent 友好的 Markdown。去除导航栏、广告、页脚、Cookie 横幅、社交按钮等干扰元素。支持 URL...

  下载

  • 用 el.getAttribute("lang") 获取原始 HTML 属性值（不是 el.lang，后者是 JS property，可能被框架覆盖）
  • 对所有已渲染的 lang 元素遍历断言，例如：document.querySelectorAll("[lang]").forEach(el => expect(el.getAttribute("lang")).toBe("zh-Hans"))
  • 特别关注动态插入内容（弹窗、AJAX 表格行），它们插入后必须立即补上 lang，否则会被当成默认语言处理

  观察实际渲染与辅助技术反馈

  语言声明是否生效，最终要看效果。几个低成本但高信息量的验证方式：

  • 标点间距：中文顿号（、）在 lang="en" 下会按英文间距渲染，明显变宽；切换为 zh-Hans 后应恢复正常紧凑间距
  • 屏幕阅读器朗读：用 VoiceOver 或 NVDA 打开页面，聚焦到 <p lang="ja">こんにちは</p>，确认它读日语而非中文音调
  • 字体 fallback：含日文假名的段落若没设 lang="ja"，可能被中文字体强行渲染，导致字形模糊或缺失；加上后应触发系统日文字体

  避免常见误判陷阱

  很多“看起来正常”的页面其实语言声明早已失效，测试时需绕过表象：

  • 别依赖 textContent 是否变化来判断语言切换成功——文字变了，但 lang 没更新，辅助技术仍错读
  • 别用 is_selected() 或 get_property("lang") 验证，它们不反映真实 DOM attribute 状态
  • 别只查根节点：即使 document.documentElement.lang === "en-US"，若某个

     里写了中文注释却没改其 <code>lang</code>，该段代码仍可能被中文字体覆盖

前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！