如何替換特定頁面？ [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'> 

參考文獻： 部分代碼取自此處的答案