Как при смене языка поменять href
Всем привет! На лендинге реализовано смена языка через json на JS
HTML Переключатель языка
<div class="header-lang-wrapper">
<div class="header-lang-en">
<input type="radio" class="header__lang" id="lang_en" name="lang" data-value="en" onchange="changeLang('en');" />
<label for="lang_en" class="header__lang-wrapper header__lang-wrapper-en">en</label>
</div>
<div class="header-lang-ru">
<input type="radio" class="header__lang" id="lang_ru" name="lang" data-value="ru" onchange="changeLang('ru');" />
<label for="lang_ru" class="header__lang-wrapper header__lang-wrapper-ru">ru</label>
</div>
</div>
Сама линка
<a class="contacts__telegram link-telegram">
<span class="langchange" data-key="contacts-telegram">Наше комьюнити в Телеграм</span>
</a>
JS
const langJSON = {
"en" : {
"contacts-telegram" : "Nutra Affiliate Community",
},
"ru" : {
"contacts-telegram" : "Наше комьюнити в Телеграм",
}
}
document.addEventListener("DOMContentLoaded", function(event) {
var appLang = localStorage.getItem('lang');
// if no language value saved in local-storage, set en as default
if(appLang === null){
localStorage.setItem('lang', 'en'); // updaet local-storage
// fun contentUpdate function with en value
contentUpdate('en');
// select radiobutton which has data-value = en
document.querySelector('[data-value="en"]').checked = true;
} else {
// fun contentUpdate function with value from local-storage - en, ru..
contentUpdate(appLang);
// select radiobutton which has data-value == local storage value
document.querySelector('[data-value="'+appLang+'"]').checked = true;
}
});
const langWrapper = document.querySelector('.header-lang-wrapper');
const langTrigger = document.querySelectorAll('.header__lang-wrapper');
langTrigger.forEach(lang => {
lang.addEventListener('click', () => {
langWrapper.classList.toggle('change');
})
})
// change innerhtml on radiobtn click
function changeLang(langVal){
// set local-storage lang value from value given in onchange="changeLang(value)"
localStorage.setItem('lang', langVal);
// fun contentUpdate function with value from onchange="changeLang(value)"
contentUpdate(langVal);
}
// content/innerhtml update/assign
function contentUpdate(cl){
// get current langage contents in array
var currLang = Object.entries(langJSON)[Object.keys(langJSON).indexOf(cl)][1],
// get current language content array length
langCont = Object.entries(currLang).length;
for(let i = 0; i < langCont; i++) {
// get selectors which has .langchange classes
var getSelector = document.querySelectorAll('.langchange')[i],
// get data-key attribute from .langchange class selectors
getAttr = getSelector.getAttribute('data-key')
// assign the data-key value from current language array to the .langchange[data-key] selector
getSelector.innerHTML = currLang[getAttr];
}
}
Проблема в том что href должен меняться при смене языка, как это реализовать?