每当您为全球企业开发网站或应用程序时，您还必须关注您的受众可以理解的语言。例如，英语是一种国际语言，但在世界某些地方，人们听不懂英语，因为他们说德语、西班牙语等。
但是，如果您观察过，某些网站会提供更改网站语言的选项。您只需单击按钮即可更改整个网站的语言。你有没有想过这怎么可能？
在这里，我们将学习使用 javascript 来切换网页的语言。
语法用户应按照以下语法使用 javascript 更改网页语言。
if (lang == en) { element.innerhtml = content;} else if (lang == fr) { element.innerhtml = content;} else if (lang == de) { element.innerhtml = content;}
在上面的语法中，我们编写了 if-else 语句来根据所选的语言更改网页的内容。用户需要将内容替换为特定语言的内容。
示例 1在下面的示例中，我们添加了一些 div 元素内容。每当用户按下任何按钮来更改网页的语言时，我们都会通过将语言作为参数传递来调用changelanguage()函数。在changelanguage()函数中，我们访问div元素并根据所选语言更改其内容。
<html><body> <h2>switching the language of web page using javascript</h2> <div id = div>hi how are you! this is written in english.</div><br> <div id = languageswitcher> <button onclick = changelanguage('en')> english </button> <button onclick = changelanguage('fr')> french </button> <button onclick = changelanguage('de')> german </button> </div> <script> // function to switch language of web page function changelanguage(lang) { let element = document.getelementbyid(div); if (lang == en) { element.innerhtml = hi how are you! this is written in english.; } else if (lang == fr) { element.innerhtml = bonjour comment allez-vous! cela est écrit en français.; } else if (lang == de) { element.innerhtml = hallo wie geht es dir! das ist auf deutsch geschrieben.; } } </script></body></html>
示例 2在下面的示例中，我们创建了一个包含多个元素的网页。此外，我们还为每个元素赋予了唯一的 id。在 javascript 中，我们创建了名为“languagecontent”的对象。在对象中，我们将语言存储为键，将内容存储为值。在内容对象中，我们使用元素 id 作为键，并将其特定语言的内容作为值。
在 switchlang() 函数中，我们从 languagecontent 对象中访问特定语言的内容，并替换网页上所有元素的内容。
<html><body> <h2>switching the language of web page using javascript</h2> <div id = text1> this is a sample content </div> <div id = language> english </div> <div id = brandname> tutorialspoint </div> <div id = programming_lang> javascript </div> <div id = languageswitcher> <button onclick = swithclang('en')> english </button> <button onclick = swithclang('fr')> french </button> <button onclick = swithclang('es')> german </button> </div> <script> let languagecontent = { en: { text1: this is a sample content, language: english, brandname: tutorialspoint, programming_lang: javascript, }, fr: { text1: ceci est un contenu d'exemple, language: français, brandname: tutorialspoint, programming_lang: javascript, }, es: { text1: este es un contenido de ejemplo, language: español, brandname: tutorialspoint, programming_lang: javascript, } } function swithclang(lang) { for (let key in languagecontent[lang]) { document.getelementbyid(key).innerhtml = languagecontent[lang][key]; } } </script></body></html>
用户学会了使用 javascript 切换网页语言。在第一个示例中，我们给出了如何在多种语言之间切换的演示。
我们可以将第二个示例用于实时网站。开发人员需要创建一个 json 文件来存储内容，而不是在同一个文件中，因为实时应用程序可能包含大量内容。之后，他们可以使用 for 循环来迭代 json 文件的所有元素并更新网页的内容。
以上就是如何使用javascript切换页面语言？的详细内容。