Javascript-форум - Обновление слов в тренажере

Javascript-форум (https://javascript.ru/forum/)

- Общие вопросы Javascript (https://javascript.ru/forum/misc/)

- - Обновление слов в тренажере (https://javascript.ru/forum/misc/83091-obnovlenie-slov-v-trenazhere.html)

Обновление слов в тренажере

Есть приложение для запоминания английских слов:

<div class="hed">
        <h1>Тренажер</h1>
        <h2>для изучения английских слов.</h2>
    </div>
    <div class="wrap">
        <div class="flexss">
           <h1 class="word"></h1>
           <input class="in" type="text"  placeholder="перевод"name="answer" id="iin">
          <button class="sadm">Go</button>
        </div>
        <h1 class="aut "></h1>
</div>

let jes=[
  {"inglih":"father","rus":"отец"},
  {"inglih":"boy" ,"rus":"мальчик"}, 
];

let inp=document.querySelector("#iin");
let word=document.querySelector(".word");
let aut=document.querySelector(".aut")
let batt=document.querySelector(".sadm");

let b=0;
//
let wo=jes[b].inglih;
let ru=jes[b].rus;
word.innerHTML=`${ru}`;
  
 batt.addEventListener( "click",function(){
    let res=inp.value;
    if(res==wo){
      if(aut.classList.contains("coll")){
        aut.classList.remove("coll");
                  }
    aut.innerHTML=`Молодец!Все правильно`;
  }
   else {
       aut.classList.add("coll")
       aut.innerHTML=`Не верно,попробуй еще`;
       
  };})

Один вывод делает а вот как заставить чтоб при выполнении if т.е (правильном ответе) увеличивалась переменная b и вывести данные с другого объекта не пойму.

aleks330,
написать функцию вместо строк 14 и 15, и добавить в строку 22

aleks330,

<!DOCTYPE html>
<html>

<head>
    <title>Untitled</title>
    <meta charset="utf-8">
    <style type="text/css">
        .coll {
            border: 2px red solid;
        }

        .sadm:after {
            content: attr(data-txt);
        }
    </style>
    <script>
        document.addEventListener("DOMContentLoaded", function() {
            let jes = [{
                    "inglih": "father",
                    "rus": "отец"
                },
                {
                    "inglih": "boy",
                    "rus": "мальчик"
                },
            ];
            let inp = document.querySelector("#iin");
            let word = document.querySelector(".word");
            let aut = document.querySelector(".aut")
            let batt = document.querySelector(".sadm");
            let b = -1;

            function more() {
                b = ++b % jes.length;
                let ru = jes[b].rus;
                word.innerHTML = `${ru}`;
                aut.innerHTML = '';
                batt.dataset.txt = "Go"
            }
            more();
            batt.addEventListener("click", function() {
                let res = inp.value;
                let wo = jes[b].inglih;
                if (batt.dataset.txt === "More") more();
                else if (res === wo) {
                    aut.classList.remove("coll");
                    batt.dataset.txt = "More";
                    aut.innerHTML = `Молодец!Все правильно`;
                } else {
                    aut.classList.add("coll")
                    aut.innerHTML = `Не верно,попробуй еще`;
                };
            })
        });
    </script>
</head>

<body>
    <div class="hed">
        <h1>Тренажер</h1>
        <h2>для изучения английских слов.</h2>
    </div>
    <div class="wrap">
        <div class="flexss">
            <h1 class="word"></h1>
            <input class="in" type="text" placeholder="перевод" name="answer" id="iin">
            <button class="sadm" data-txt="Go"></button>
        </div>
        <h1 class="aut "></h1>
    </div>
</body>

</html>

Тогда и13 и 11 ту да же? Я имею в виду в функцию!:) Точно проффесорский ответ абсолютно бесполезный!

Пардонте, второй ответ значительно информативней!:dance:

рони,
Спасибо!!!

рони,
Гениально особенно вот эти фрагменты

.sadm:after {
            content: attr(data-txt);
        }

let b = -1;

  batt.dataset.txt = "Go"

Такому в школе не научат:victory:

Я с этим

let b = -1;

голову сломал а всего лиш

b = ++b % jes.length;

и до такой проверки я бы не додумался

if (batt.dataset.txt === "More") more();

Шахматы это детская игра по сравнению с программированием))

Предлагаю в функцию more (сигареты с таким названием сразу вспоминаю:lol: )
добавить

inp.value='';

function more() {
      b = ++b % jes.length;
      let ru = jes[b].rus;
      word.innerHTML = `${ru}`;
      aut.innerHTML = '';
      inp.value='';
      batt.dataset.txt = "Go"
  }