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进行操作，则可以执行类似的操作以将class AddTask(celery.Task): name = 'AddTask'添加到当前位置的前面：

/de

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副本吗？如果是这样，这可能很容易。

选择第一个选项，但仅用于更改语言。
包括一个<meta>标记，用于指示当前语言
使用javascript事件监听器来拦截点击的每个链接，并根据上述meta标签插入语言。像这样的东西

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'>

参考： Part of code taken from an answer here

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

3 个答案: