无需JavaScript实现多语言博客当前路径子页面跳转的HTML方案咨询

你可以通过两种纯HTML方式实现需求，无需JavaScript：

方法1：确保页面URL以斜杠结尾 #

如果你的博客页面访问URL是http://example.com/en/blog/（末尾带/），直接使用相对路径即可：

<a href="article-1337">目标文章</a>

此时浏览器会将带末尾斜杠的URL识别为目录，所有相对路径都会基于这个目录，点击后会跳转到http://example.com/en/blog/article-1337。

你之前尝试失败的核心原因是当前URL没有末尾斜杠（/en/blog），浏览器会把它当成一个名为blog的文件，相对路径会基于上层的/en/目录，所以才会跳转到/en/article-1337。

方法2：使用<base>标签统一基准路径 #

在页面的<head>中添加<base>标签，指定所有相对链接的基准URL：

<head>
  <!-- 根据语言环境动态设置这里的href，比如/en/blog/或/fr/blog/ -->
  <base href="/en/blog/">
</head>
<body>
  <a href="article-1337">目标文章</a>
</body>

无论当前页面URL是否带末尾斜杠，所有相对路径的链接都会基于<base>指定的路径跳转，完美适配多语言环境，无需为每个链接添加翻译内容。

注意：<base>标签的href必须以斜杠结尾，否则基准路径会出错；同时页面内的其他相对资源（如CSS、图片）也会基于这个路径加载，需确保资源路径匹配。

内容的提问来源于stack exchange，提问作者Sølve