以下該版本實作了簡易的多語言方案 ，你可以去維護一套多語言的json ,進行前端的語言切換。通過擷取自定義資料 data-trans 來改變語言。
html 結構
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>多語言</title>
</head>
<body>
<h1 id="locale">en</h1>
<h3 data-trans="js_gloTitle">多語言</h3>
</body>
<script src="jquery-3.3.1.min.js"></script>
<script src="demo.js"></script>
</html>
對應的demo.js 代碼:
"use strict";
window.global_lan = 'zh';
// 擷取對應的json 對象
var getTranslate = null;
// 改變對應的json 對象
var setTranslate = function (e) {
var lanObj;
lanObj = {
zh: {
js_gloTitle: "這是最後的機會",
},
en: {
js_gloTitle: "Dream of Your West Journey",
}
}[/^zh/.test(e) ? "zh" : "en"];
// 設定其值
getTranslate = function (e) {
return lanObj[e] || e
}
};
$(function () {
(function e() {
window.global_lan = localStorage.language || window.navigator.language;
setTranslate(global_lan);
var t = /^zh/.test(global_lan);
$("#locale").text(t ? "en" : "cn");
// 擷取所有需要翻譯的結構化資料
var r = $("[data-trans]");
Array.prototype.forEach.call(r, function (e) {
var a = e.getAttribute("data-trans");
e.textContent = getTranslate(a)
})
// 手動切換語言 en or zh
$("#locale").off('click').on("click", function () {
localStorage.setItem("language", t ? "en" : "zh");
setTranslate(global_lan);
e();
});
})()
});
還有更好的方案，看自己需求決定！
![nodejs微信開發---授權登入+擷取使用者資訊微信網頁授權[圖]](data:image/gif;base64,R0lGODlhAQABAIAAAP///wAAACwAAAAAAQABAAACAkQBADs=)