如何替换特定页面？ [HTML多语种网站]

Question

我的问题很简单。

我有一个英文的静态HTML网站。

www.website.com

www.website.com/services

www.website.com/contacts

我也用德语翻译了它：

www.website.com/de/

www.website.com/de/services

www.website.com/de/contacts

我用于更改语言的按钮（标志）位于我的导航旁边：

<ul class="language">
   <li class="de"><a href="#"></a></li>
</ul>

选项1：我可以用“德语版”页面替换“＃”。 例如，在www.website.com上，它是<a href="www.website.com/de/"> ，在www.website.com/services上，它是<a href="www.website.com/de/services">

但这是太多的工作。 是否有一种更简单的方法来使用javascript或.htaccess ..或任何你的建议来调用页面。 我的页面是.html，所以.php选项效率不高。 并为每个元素添加“id”以便翻译它......比第一个选项更复杂。

提前致谢！

Answer 1

理想情况下，您应该使用网站的服务器端语言（PHP / ASP / Java / ...）来实现。 如果您仍想在Javascript中执行此操作，则可以执行类似操作以在当前位置添加/de ：

<a href="www.website.com/de/" id="language">
<script>document.getElementById('language').setAttribute('href', '/de'+document.location.pathname);</script>

Answer 2

是的，我怀疑这个JavaScript应该工作：

 $(document).ready(() => { let path = window.location.pathname; if (path.startsWith('/de')) $('a.lang-switch').attr('href', path.substr(3)); else $('a.lang-switch').attr('href', '/de' + path); console.log($('a').attr('href')); }); 

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <a class="lang-switch">Change Language</a> 

Answer 3

你有两个不同的HTML副本吗？ 如果是这样，这可能很容易。

1. 选择第一个选项，但仅限于更改语言。
2. 包含指示当前语言的<meta>标记
3. 使用javascript事件侦听器拦截单击的每个链接，并根据上面的元标记插入语言。 像这样的东西;

 let lang = document.getElementsByName('lang')[0].getAttribute('lang'); // Get the parent DIV, add click listener... document.body.addEventListener("click", function(e) { // e.target was the clicked element if(e.target && e.target.nodeName == "A") { e.target.href.replace('yourwebsite.com', `yourwebsite.com/${lang}/`); } }); 

 <meta name='lang' lang='de'> 

参考文献： 部分代码取自此处的答案