页面静态化CSS HTML 多语言配置 兼容wap

div 通过id 获取语言标识

<div class="dropdown-menu" aria-labelledby="navbarDropdown">
	<a class="dropdown-item" href="javascript:;" id="en-gb">English</a>
	<a class="dropdown-item active" href="javascript:;" id="zh">中文</a>
	<a class="dropdown-item" href="javascript:;" id="zh-tw">繁体中文</a>
	<a class="dropdown-item" href="javascript:;" id="jp">日本語</a>
</div>

js里配置多语言内容

$(function(){
	var arrLang = {
		"en-gb": {
			"btntext":'white paper',
			"lang":'English',
			"index": "Home",
		},
		"zh": {
			"btntext":'白皮书',
			"lang":'中文',
			"index": "首页",
			
		},
		"jp": {
			"btntext":'白書',
			"lang":'詳細を表示',
			"index": "トップページ",
		},
		"zh-tw": {
			"btntext":'白皮書',
			"lang":'繁体中文',
			"index": "首頁",
		}
	};
	
	// The default language is English
	var lang = "zh";
	// Check for localStorage support
	if ('localStorage' in window) {
		var usrLang = localStorage.getItem('uiLang');
		if (usrLang) {
			lang = usrLang
		}
	}
	console.log(lang);
	$(document).ready(function() {
		$(".lang").each(function(index, element) {
			$(this).html(arrLang[lang][$(this).attr("key")]);
		});
	});
	$(document).ready(function() {
		$(".langinput").each(function(index, element) {
			$(this).attr('placeholder',arrLang[lang][$(this).attr("key")])
		});
	});
	
	if(localStorage.getItem('uiLang') == "en-gb" || localStorage.getItem('uiLang') == "jp"){
		$("body").addClass('en-body')
	}else{
		$("body").removeClass('en-body')
	}
	$(".dropdown-menu .dropdown-item").each(function(){
		var lang = $(this).attr("id");
		if(localStorage.getItem('uiLang') == lang){
			$(this).addClass('active').siblings('a').removeClass('active')
		}
	})
	
	
	// get/set the selected language
	$(".dropdown-menu .dropdown-item").click(function() {
		var lang = $(this).attr("id");
		// update localStorage key
		if ('localStorage' in window) {
			localStorage.setItem('uiLang', lang);
			console.log(localStorage.getItem('uiLang'));
		}
		$(".lang").each(function(index, element) {
			$(this).html(arrLang[lang][$(this).attr("key")]);
		});
		
		$(".langinput").each(function(index, element) {
			$(this).attr('placeholder',arrLang[lang][$(this).attr("key")])
		});
		
		$(this).addClass('active').siblings('a').removeClass('active')
		$('.ex-span').text($(this).text());
		
		if(localStorage.getItem('uiLang') == "en-gb" || localStorage.getItem('uiLang') == "jp"){
			$("body").addClass('en-body')
		}else{
			$("body").removeClass('en-body')
		}
		location.reload()
		
	});
});