i18n internationatization

by harsh dand

HTML

<h1 data-i18n="greeting"></h1>
 <p data-i18n="farewell"></p>

 <button onclick="setLanguage('en')">English</button>
 <button onclick="setLanguage('es')">Español</button>

JavaScript

const translations = {
  en: {
    'greeting': 'greeting'
  },
  es: {
    'greeting': 'dasdfasd'
  }
};


function setLanguage(lang) {
  if (translations[lang]) {
    applyTranslation(lang);
  }
}

function applyTranslation(lang) {
  document.querySelectorAll('[data-i18n]').forEach(element => {
    const key = element.getAttribute('data-i18n');
    element.textContent = translations[lang][key];
  });
}

document.addEventListener('DOMContentLoaded', () => {
	console.log(navigator.language);
  const userLang = navigator.language.startsWith('es') ? 'es' : 'en'; // Example language detection
  setLanguage(userLang);
});