rel="alternate" hreflang仅用于告知搜索引擎多语言版本关系，非语言切换功能；须每页双向互指、用绝对url、静态生成，且hreflang值严格遵循bcp 47规范，否则整组可能被忽略。
直接说结论：rel="alternate" + hreflang 不是用来做语言切换按钮的，只告诉搜索引擎“这个页面有其他语言版本”，而且必须每页双向写全、用绝对 URL、静态输出，漏一条或写错格式，整组都可能被忽略。
hreflang 值必须严格按 BCP 47 写，大小写/连字符一个都不能错
常见错误是随手写 zh、EN-US、zh_CN 或 chinese——这些全无效。Google 只认标准 IETF 标签：
-
zh-Hans（简体中文，注意 H 和 s 大写，中间是短横） -
zh-Hant-TW（台湾繁体，三段式合法） -
en-US（地区大写，语言小写） -
x-default（仅用于兜底页，比如英文首页）
错写成 zh-hans 或 zh_Hans，爬虫直接跳过整条 <link>。别指望“差不多能识别”。
所有语言页必须双向互指，且每页都得包含完整集合
假设你有中、英、日三版，那么 https://example.com/zh/ 的 里要写：
<link rel="alternate" hreflang="zh-Hans" href="https://example.com/zh/"><link rel="alternate" hreflang="en" href="https://example.com/en/"><link rel="alternate" hreflang="ja" href="https://example.com/ja/"><link rel="alternate" hreflang="x-default" href="https://example.com/en/">
同理，https://example.com/en/ 也得把这四条原样写一遍——包括指向自己的那条。不能靠模板省略“当前页”，也不能 JS 动态补。
漏掉任意一个反向声明，比如日文页没写回中文页的链接，Google 就认为“日文版没有中文对应”，整个语言组索引权重下降。
绝对 URL + 静态生成，JS 注入基本等于白干
href 必须是绝对 URL，/zh/ 或 ./zh/ 会被爬虫忽略；更关键的是：rel="alternate" 标签必须在 HTML 源码里静态存在。
JS 动态插入风险极高：
- 爬虫不执行 JS，动态加的标签对 SEO 零作用
- 后端已输出静态标签，前端又用
document.head.appendChild()追加，导致同个hreflang出现两次，Google 直接放弃解析 - 用
innerHTML +=拼接容易覆盖原有<link>，引发缺失
真要用 JS（比如 SPA 路由），必须先清理旧标签：document.querySelectorAll('link[rel="alternate"][hreflang]') 全部 remove()，再重写——但优先选服务端渲染或构建时生成。
验证时最容易被忽略的三个点
很多人查了源码有标签就以为 OK，其实真正出问题的常在这儿：
- 某语言页返回 404（比如
href="https://example.com/fr/"页面实际不存在） -
和hreflang="zh-Hans"不一致（脚本和区域标识不匹配） - 同一页面里出现两条
hreflang="zh-Hans"（静态写了一条，JS 又加一条）
验证别只看源码，得用 Google Search Console 的「国际化报告」或 Screaming Frog 抓取全部语言页，比对是否闭环、URL 是否可访问、标签是否唯一。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
