hreflang属性仅对link标签有效，必须置于head中且成组互指；a标签添加无效，需用js或服务端实现语言切换；值须严格符合bcp 47规范，配合html lang属性使用。
hreflang 属性不能用在 HTML 的 a 标签里，它只对 link 标签有效；写在 a 上浏览器会直接忽略，搜索引擎也完全不认。
hreflang 只能出现在 link 标签中，不是 a 标签的属性
很多人把 hreflang 当成类似 target 或 rel 那样的通用链接属性，往 a 标签里加：@#@#@#@#@#@#@#@#@#@0。这毫无作用——浏览器不解析、不校验、不传递任何语义。
真正起效的写法必须是：<link rel="alternate" hreflang="zh-cn" href="https://example.com/zh/">，且只能放在 里。
-
hreflang是 HTML 规范中明确限定为link元素的合法属性，a元素没有该属性定义 - 想实现用户点击切换语言？得靠 JS 或服务端路由，
hreflang不参与任何前端交互 - SEO 工具（如 Google Search Console）只扫描
中的link[rel="alternate"][hreflang]，a标签里的内容会被跳过
每个语言页都必须“自指 + 互指”，漏一条整组失效
假设有英文页 https://example.com/en/、中文页 https://example.com/zh/、日文页 https://example.com/ja/，那么三页的 都要包含全部三条 link：
<link rel="alternate" hreflang="en" href="https://example.com/en/"><link rel="alternate" hreflang="zh" href="https://example.com/zh/"><link rel="alternate" hreflang="ja" href="https://example.com/ja/">
注意：hreflang="zh" 指向的必须是当前页自身的绝对 URL（比如中文页里这条的 href 就是 https://example.com/zh/），不是“只写别人”。漏掉任意一个，Google 可能直接放弃整个 hreflang 关系组。
- 不要只在中文页写指向英文的
hreflang，英文页也必须回指中文 - 如果用了
x-default，它也要出现在每一页的中，且href必须指向兜底页（如国际首页） - 所有
href必须是绝对 URL，/zh/或zh/这类相对路径会被爬虫彻底忽略
hreflang 值必须严格符合 BCP 47，大小写、连字符错一个就无效
拼写不是“差不多就行”，Googlebot 会逐字符校验。常见错误包括：EN-us（语言大写）、zh_CN（下划线）、chinese（非标准码）、zh-TW（未声明脚本，应优先用 zh-Hant-TW）。
正确示例：en-us、zh-cn、zh-hant-tw、ja-jp、x-default。全部小写，用连字符分隔，无空格，无多余字符。
-
lang属性和hreflang值没有绑定关系，但建议保持一致（如对应hreflang="zh-cn"） - 同一页面内不能重复声明相同
hreflang值，后端模板或 JS 动态注入时容易多加一条，导致验证失败 - 避免用 query 参数做多语言路由（如
?lang=zh），Google 明确不推荐，可能被当成重复内容处理
hreflang 和 lang 属性职责分离，别指望它自动改页面语言
hreflang 只告诉搜索引擎“这个 URL 是什么语言版本”，lang 才决定浏览器怎么渲染文字、标点、字体 fallback 和屏幕阅读器发音。两者不互通、不推导、不覆盖。
典型翻车：中文页写了 hreflang="zh-cn" 指向自己，但 标签没写 lang="zh-cn"，结果页面仍按英文渲染——中文段落断行异常、引号间距错、VoiceOver 用英语念汉字。
- 必须手动设置
，不能依赖hreflang推导 - 局部混排外文内容（如引用英文术语），需用内联
lang，例如：<p lang="en">React hooks</p> - SPA 多语言切换时，既要更新文案，也要同步执行
document.documentElement.lang = "zh-cn"
最容易被忽略的是闭环完整性：不是“写了就算”，而是每条链接是否可访问、是否返回 200、是否语言真实匹配、是否在所有语言页中成组出现。验证不能靠肉眼，得用 Google Search Console 的国际化报告或 Screaming Frog 抓取比对。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
