Uncaught TypeError: Cannot read properties of null (reading 'addEventListener')
Помогите исправить ошибку , то сижу все не могу исправить какой час.
<body>
<script src="assets/js/multilingualismConrol.js"></script>
<header class="header" id="header" style=" margin-top: -50px;">
<div class="nav_menu-container">
<ul class="nav_menu">
<li>
<a class="lng-au shadow" id="aboutus" href="#">aboutus</a>
</li>
<li>
<a class="projects" id="projects" onclick="document.querySelector('.projects_container').scrollIntoView()">projects</a>
</li>
<li>
<a class="skill" id="skill" onclick="document.querySelector('.skill_container').scrollIntoView()">skill</a>
</li>
<li>
<a class="contacts" id="contacts" onclick="document.querySelector('.contacts_container').scrollIntoView()">contacts</a>
</li>
</ul>
<div class="topmenu" id="op">
<div class="translate">
<a class="submenu-link">
<img class="open-tran" src="assets/img/planetsphere_1220461.png" alt="">
</a>
<ul class="submenu">
<li>
<a class="translate" id="e-lang-en">
<img style="width: 40px; height: 40px; border-radius: 30px" src="assets/img/united-states.png" alt="">
</a>
</li>
<li>
<a class="translate" id="e-lang-ru">
<img style="width: 40px; height: 40px; border-radius: 30px;" src="assets/img/russia.png" alt="">
</a>
</li>
<li>
<a class="translate" id="e-lang-ua">
<img style="width: 40px; height: 40px; border-radius: 30px;" src="assets/img/ukraine.png" alt="">
</a>
</li>
</ul>
</div>
</div>
</header>
<main class="main_content">
</main>
<footer class="footer">
</footer>
<script src="assets/js/multilingualismTranslate.js"></script>
</body>
<script>
let txt = {
en: {
'aboutus':'• about us',
'projects':'• projects',
'skill':'• skill',
'contacts':'• contacts'
} ,ru: {
'aboutus':'• о нас',
'projects':'• проекты',
'skill':'• скилы',
'contacts':'• контакты'
} ,ua: {
'aboutus':'• про нас',
'projects':'• проекти',
'skill':'• скіли',
'contacts':'• контакти'
}
};
const langEn = document.getElementById('e-lang-en');
const langRu = document.getElementById('e-lang-ru');
const langUa = document.getElementById('e-lang-ua');
langEn.addEventListener('click', setLang.bind(null, 'en'));
langRu.addEventListener('click', setLang.bind(null, 'ua'));
langUa.addEventListener('click', setLang.bind(null, 'ru'));
function setLang(lang){
var e;
if(!txt.hasOwnProperty(lang)) return;
if(window.hasOwnProperty('localStorage'))
window.localStorage.setItem('lang', lang);
for(e in txt[lang]) {
document.getElementById(e).innerText = txt[lang][e];
}
}
var lang = (window.hasOwnProperty('localStorage') && window.localStorage.getItem('lang', lang)) || 'ru';
setLang(lang);
Ответы (1 шт):
Автор решения: Александр Сычёв
→ Ссылка
вот это 'let txt = .....' нужно заключить в
<script type="text/javascript">
...
</script>
<script ype="text/javascript">
let txt = {
en: {
'aboutus':'• about us',
'projects':'• projects',
'skill':'• skill',
'contacts':'• contacts'
} ,ru: {
'aboutus':'• о нас',
'projects':'• проекты',
'skill':'• скилы',
'contacts':'• контакты'
} ,ua: {
'aboutus':'• про нас',
'projects':'• проекти',
'skill':'• скіли',
'contacts':'• контакти'
}
};
const langEn = document.getElementById('e-lang-en');
const langRu = document.getElementById('e-lang-ru');
const langUa = document.getElementById('e-lang-ua');
langEn.addEventListener('click', setLang.bind(null, 'en'));
langRu.addEventListener('click', setLang.bind(null, 'ua'));
langUa.addEventListener('click', setLang.bind(null, 'ru'));
function setLang(lang){
var e;
if(!txt.hasOwnProperty(lang)) return;
if(window.hasOwnProperty('localStorage'))
window.localStorage.setItem('lang', lang);
for(e in txt[lang]) {
document.getElementById(e).innerText = txt[lang][e];
}
}
var lang = (window.hasOwnProperty('localStorage') && window.localStorage.getItem('lang', lang)) || 'ru';
setLang(lang);
</script>