Как правильно написать условие?

Question

[RushV]

Здравствуйте!
Я только учу JS хотел написать код типа секундомер после 10 секунд появлялось сообщение. Как правильно написать код где у меня ошибка в коде?

function timer() {
			var s = Number(document.getElementById("timer").innerHTML);
			s++;
			document.getElementById("timer").innerHTML = s;
			if (s < 10)setTimeout("timer()", 1000);
			else document.write("12");
			
		}

Answer 1

[Антон Спирин]

Если надо производить какое-то действие каждую секунду, то правильней использовать setInterval:

function startTimer(secs) {
  var i = 0;
  var timer = document.getElementById('timer');

  var interval = setInterval(function() {
    if (++i >= secs) {
      clearInterval(interval);
      timer.innerHTML = 'Done!';
    } else {
      ++timer.innerHTML;
    }
  }, 1000);
}

startTimer(10);

Демо.

Если действие каждую секунду производить не надо, то таймаут рациональней задать один на всю длительность:

function startTimer(secs) {
  var timer = document.getElementById('timer');
  setTimeout(function() {
      timer.innerHTML = 'Done!';
  }, secs * 1000);
}

startTimer(10);

Демо.

Comments

[RushV]

А как вывести вместо "Done!" вывести предложение?
У меня просто в примере выводится "Прошло секунд Done! сек "
Можно как то вывести картинку или какой то блок?

[Антон Спирин]

RushV, можно вывести и сделать все, что угодно. Пример.

[RushV]

А можно изменить только вот эту часть "timer.innerHTML = 'Done!';" или надо дописать куча всего?
Просто я хочу понять как это всё работает разобрать по частям.

[Антон Спирин]

RushV, можно.

[RushV]

А вон как спасибо я кажется понял)

Answer 2

[TerNik]

Вы не правильно используете setTimeout
Посмотрите, что должно передаваться в параметры, и что у вас.

Comments

[riot26]

А в чём проблема? Строкой код тоже можно передать.

[Алексей Уколов]

А что не так? setTimeout принимает строку с кодом. Это устаревший вариант, но вполне рабочий.

[RushV]

А как правильно написать такой код?

[Алексей Уколов]

Но вот если заменить "timer()" на timer, то всё работает. А строка выдаёт ошибку "timer is not a function". Странное поведение, интересно, чем оно вызвано?

[TerNik]

сама возможность использовать строку сохраняется лишь для совместимости.
Вместо них используйте анонимные функции, вот так:
setTimeout(function() { alert('Привет') }, 1000);

function timer() {
    var s = Number(document.getElementById("timer").innerHTML);
    s++;
    document.getElementById("timer").innerHTML = s;
    if (s < 10) setTimeout(function () {
        timer()
    }, 1000);
    else document.write("12");
}

Или так:

function timer() {
    var s = Number(document.getElementById("timer").innerHTML);
    s++;
    document.getElementById("timer").innerHTML = s;
    if (s < 10) setTimeout(timer, 1000);
    else document.write("12");
}

[Алексей Уколов]

Лучше вообще setTimeout(timer, 1000)

Answer 3

[Алексей Уколов]

https://jsfiddle.net/d63me5rg/