Уже вполне привычная, но не очень приятная практика на сайтах, когда что-нибудь вылазить во время просмотра, через какое-то время. Прямо скажу, мне это не очень нравится, но это лишь частный пример, а на самом деле все то, о чем будет рассказано в этой статье можно использовать не только для таких ситуаций, но и просто для последовательного вывода информации через какое-то определенное время.
 Ну и в самом таком неординарном применении, можно даже выводить какой-то отсчет времени, если для переменной задать период обновления и ориентироваться на него. В общем давайте-ка к материалу статьи, там сейчас сами все поймете и увидите.

 Все о чем я говорил во вступлении, теперь разберу по порядку и более предметно.

Оператор setInterval и setTimeout

Для задержки срабатывания функции, а еще точнее для регулярного срабатывания функции используется оператор setInterval. Он первоначально запускает функцию  какой-то указанной задержкой, а после принуждает, если так можно сказать, выполнять функцию вновь и вновь, то есть многразово. 

Если в нет нужды в том, чтобы функция работала постоянно с какой-либо периодичностью, то можно применить setTimeout. Смысл у этого оператора такой же, разве что вызывается он только один раз и все!

Что относительно синтаксиса записи операторов, то записывать их можно двумя способами. 

1 способ 

function say() {...} 

setInterval (say, 3000);

 

2 способ

setInterval (function say() {...}, 3000);

Теперь самое время перейти к примерам. Ведь какое изучение без возможности показать что-то "вживую".

Вывод информации через определенное время

Это самый простой вариант. В этом случае информация будет появляться просто через какое-то время и все! Давайте посмотрим на пример. 

Пример 1

 

Ну, а теперь код

Смотреть код

Переходим к следующему варианту, когда информация не просто появится через какое-то время, а будет еще и обновляться.

Вывод информации через определенное время, с возможностью ее постепенно подменять

Итак, этот код практически повторяет первый, с одним дополнительным условием. Здесь вводится переменная, которая начинает расти. И вот, когда она достигает выбранного значения, мы можем вывести еще что-нибудь. Причем количество таких условий, в зависимости от изменения переменной будет ограничиваться лишь вашими желаниями... Пример ниже. 

Пример 2

 

Смотреть код 

Следующий вариант, когда мы видим изменение той самой переменной через заданный промежуток времени и по факту это получается отсчет без классического Date для Ява скрипт.

Использование функции с периодичностью исполнения в качестве таймера отсчета

Опять же необходимо привести пример, чтобы представлять о чем я рассказывал выше.

Пример 3

 

Смотреть код

На этом можно уже и откланяться. А уж какую гремучую смесь можно сделать из всего этого, особенно если начать объединять вывод таймера, текста и еще чего-нибудь, так тут уж только остается догадываться. Все в ваших руках!