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>
→ Ссылка