牛骨文教育服务平台(让学习变的简单)
博文笔记

HTML实现简单中英文切换(仅限小页面)

创建时间:2017-11-30 投稿人: 浏览次数:1061

最近一个网页项目实现中英文切换,网上的各种方法众多,有谷歌和360api的自动翻译接口,自建库等等,但是我想实现的不过是在我这个页面点击切换语言即可,思路是替换原有div,只有几行代码,(ps:觉得没技术含量或者没东西的太基础了的出门右拐)如下:

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title>Language change</title>
	<script type="text/javascript">
	 function changeLanguage(){
	 	document.getElementById("p1").innerHTML="这是一个苹果婊";
	 	document.getElementById("p3").innerHTML="婊苹果";

	 }
	</script>
	</head>
	<body>
		<input type="button" onclick="changeLanguage()" value="切换语言" />
       <div id="div1">
       	 <p id="p1">This is a pen</p>
       	 <p id="p2">This is an apple</p>
       	 <p id="p3">applepen pen</p>
       </div>
	</body>
</html>
初始界面:


点击按钮:


即可实现语言切换功能。

再次声明只适合小页面,如果是大项目请用接口字典啥的。

声明:该文观点仅代表作者本人,牛骨文系教育信息发布平台,牛骨文仅提供信息存储空间服务。