Как подключить JSON файлы для перевода строк HTML?

Всем привет! Помогите реализовать перевод текста с помощью JSON/JS. Есть html код:

<nav class="site-nav">
  <ul id="navigation">
    <li data-menuanchor="about-us">
      <a href="#about-us" data-lang="about_academy">Про академию</a>
    </li>
    <li data-menuanchor="what-we-offer">
      <a href="#what-we-offer" data-lang="proposal">Что мы предлагаем</a>
    </li>
    <li data-menuanchor="your-benefits">
      <a href="#your-benefits" data-lang="your_result">Что ты получишь</a>
    </li>
    <li data-menuanchor="our-blog">
      <a href="#our-blog" data-lang="blog">Блог</a>
    </li>
    <li data-menuanchor="testimonials">
      <a href="#testimonials" data-lang="feedback">Отзывы</a>
    </li>
    <li data-menuanchor="contacts">
      <a href="#contacts" data-lang="contacts">Контакты</a>
    </li>

    <div class="header__language" id="language">
      <a class="language__link">
        <button class="language" id="eng">ENG</button>
      </a>
      <a class="language__link">
        <button class="language" id="ru">RU</button>
      </a>
    </div>
  </ul>
</nav>

Нужно с помощью JS при нажатии на кнопки RU или EN вытягивать данные из JSON файлов (en.json и ru.json) для реализации перевода текста html. Файлы json лежат в корне проекта.

 {
  "about_academy": "Про Академию",
  "proposal": "Что мы предлагаем",
  "your_result": "Что ты получишь",
  "feedback": "Что говорят выпускники",
  "blog": "Блог",
  "contacts": "Контакты",
  "our_mission_main": "Наша миссия"
}

{
  "about_academy": "About the Academy",
  "proposal": "What we propose",
  "your_result": "What will you get",
  "feedback": "What the graduates say",
  "blog": "Blog",
  "contacts": "Contacts",
  "our_mission_main": "Our mission"
}

Ответы (0 шт):