根据页面语言动态加载内容

Question

我正在使用具有以下元素来设置语言的外部系统：

<meta http-equiv="Content-Language" content="en-US">

我们有以下语言：

en-US, en-GB, fr-FR, de-DE, es-ES, pl-PL, and pt-BR

我们可以创建自定义页面，我想使用jQuery .load（）来基于“ content”属性的值加载不同的内容。

例如：

IF "content=fr-FR" THEN $('#support-info').load('support-info-fr.html');

我绝不是Web开发人员（我更像是一名复制/粘贴/编辑人员）。我一直在搜索几个小时，发现了if / else jQuery语法，但似乎无法将它们放在一起。

希望我已经提供了所有必要的信息，并尽可能使之清晰。谁能指出我正确的方向/帮助我？将不胜感激！

Answer 1

使用attribute selector

const contentLanguage = $('[http-equiv="Content-Language"]').attr('content')

if (contentLanguage == 'fr-FR') {
  $('#support-info').load('support-info-fr.html');
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<meta http-equiv="Content-Language" content="en-US">

OR
 
if ($('[http-equiv="Content-Language"][content="fr-FR"]').length) {
  $('#support-info').load('support-info-fr.html');
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<meta http-equiv="Content-Language" content="en-US">
    

Answer 2

您可以使用基本选择器轻松获得meta标签。然后使用switch case语句设置要加载的页面。然后像上面一样加载页面。

$(document).ready(() => {
  var lang = $('meta[http-equiv="Content-Language"]').attr('content');
  var page = '';
  switch(lang) {
    case 'en-US':
    page = 'support-info-en.html'
    break;
    case 'fr-FR':
    page = 'support-info-fr.html'
    break;
    //Add all possibilities
  }
  $('#support-info').load(page);
});

<meta http-equiv="Content-Language" content="en-US">
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>