用Jquery和Json实现多语言切换 · 前端开发

用Jquery和Json实现多语言切换： ``` <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>用Jquery和Json实现多语言切换</title> <script src="http://code.jquery.com/jquery-3.5.1.min.js"></script> <script type="text/javascript"> var arrLang = { 'en': { 'home': 'Home', 'about': 'About', 'contact': 'Contacts', 'content': 'This is content' }, 'zh': { 'home': '首页', 'about': '关于', 'contact': '联系', 'content': '这是内容' } }; // Process translation $(function() { $('.translate').click(function() { var lang = $(this).attr('id'); $('.lang').each(function(index, item) { $(this).text(arrLang[lang][$(this).attr('key')]); }); }); }); </script> </head> <body> <button id="zh" class="translate">中文</button> <button id="en" class="translate">English</button> <ul> <li class="lang" key="home">首页</li> <li class="lang" key="about">关于</li> <li class="lang" key="contact">联系</li> </ul> <p class="lang" key="content">这是内容</p> </body> </html> ```