Как сделать автообновление страницы
На некоторых страницах требуется постоянное автообновление. Например, это могут быть текущие результаты какого-нибудь матча. Или это могут быть котировки валют или акций. В общем, задача есть, и нужно подобрать оптимальное решение для неё. И в этой статье я расскажу, как сделать автообновление страницы.
Большинство разработчиков сразу же побегут к JavaScript, однако, использовать его в этой ситуации совсем не нужно. Достаточно использовать HTML:
В результате, каждые 30 секунд страница будет перезагружаться. И это работает во всех браузерах, независимо от поддержки JavaScript.
Можно пойти и дальше. Вы, возможно, встречали сайт, где предлагали настроить время автообновления. Это реализуется следующим образом:
Вот так уже реализуется настраиваемое автообновление, и опять же мы обошлись лишь одним HTML и PHP.
Создано 12.04.2013 11:58:38
Копирование материалов разрешается только с указанием автора (Михаил Русаков) и индексируемой прямой ссылкой на сайт (http://myrusakov.ru)!
Добавляйтесь ко мне в друзья ВКонтакте: http://vk.com/myrusakov.
Если Вы хотите дать оценку мне и моей работе, то напишите её в моей группе: http://vk.com/rusakovmy.
Если Вы не хотите пропустить новые материалы на сайте,
то Вы можете подписаться на обновления: Подписаться на обновления
Если у Вас остались какие-либо вопросы, либо у Вас есть желание высказаться по поводу этой статьи, то Вы можете оставить свой комментарий внизу страницы.
Порекомендуйте эту статью друзьям:
Если Вам понравился сайт, то разместите ссылку на него (у себя на сайте, на форуме, в контакте):
- Кнопка:
Она выглядит вот так: - Текстовая ссылка:
Она выглядит вот так: Как создать свой сайт - BB-код ссылки для форумов (например, можете поставить её в подписи):
Комментарии ( 6 ):
lev_100rus 12.04.2013 15:07:30
Но ведь тогда страница будет перезагружаться и пользователя это будет я думаю раздражать. Лучше через AJAX получать новые данные и выводить без всяких перезагрузок
dima9595 12.04.2013 16:27:59
Скорей всего тогда будет нагружаться клиент.
Maks4ever 27.12.2014 02:46:43
бросается в глаза строчка доктайп для html5 а потом идёт стока для xmlns, в начале не заработало а потом сохранил эту страницу с расширением php a не html на хосте и заработало
Maks4ever 27.12.2014 02:48:44
за то время пока тупил со скриптом выучил условный оператор $delay = isset($_POST[«delay»])? $_POST[«delay»]: 30; а также команду echo — 😉
Centos 26.02.2016 22:12:47
А как сделать чтобы обновление было разовое(раз в сутки, или при первом входе на сайте), или два интервала. Скажем один через десять секунд, а второй через пару часов. Поскольку пользователь не находится на одной страницы чтобы ждать что через 15 минут добавиться что-то новое,а каждые 10 секунд можно здуреть, если страница будет обновляться.
Kuznecov138 21.01.2018 17:13:14
А как сделать что бы обновлялась страница если пользователь в браузере нажал «назад». И та страница на которую он вернулся, обновилась? Желательно причем один раз.
Для добавления комментариев надо войти в систему.
Если Вы ещё не зарегистрированы на сайте, то сначала зарегистрируйтесь.
Copyright © 2010-2023 Русаков Михаил Юрьевич. Все права защищены.
Автообновление HTML-страниц в браузерах Chrome, Firefox и Opera
При кодинге достаточно удобной штукой является автообновление страницы в окне браузера. То есть, это когда в открытом редакторе (пускай это будет мой любимый Sublime Text) вносятся правки или изменения в самом HTML или CSS-коде, а в окне браузера сразу наглядно видны эти изменения. Очень удобная возможность именно благодаря своей наглядности.
Но вот “беда” — почти все популярные браузеры не обладают такой способностью изначально. Их этому нужно научить. Самый простой способ — это установить в них расширения или дополнения, предназначенные именно для этой цели. Другой, более сложный способ — это воспользоваться скриптом LiveReload. Также я видел на GitHub одноименное расширение под редактор Sublime Text.
Но сегодня я остановлюсь на самом простом способе — встраивание расширений в браузеры. Первоначально хотел сам написать обзор таких дополнений, но наткнулся в Интернете на статью, в которой уже был описан такой способ для Chrome, Firefox и Opera. Поэтому изменил свое решение и сделал вольный перевод статьи, текст которой привожу ниже.
Далее — перевод статьи.
Иногда при работе в Интернете может возникнуть необходимость в автообновлении страниц. Например, необходимо постоянно следить за счетом в online-игре, регулярно проверять новости или же с нетерпением ждать своих оценок на сайте колледжа. В предыдущей статье шла речь об online-сервисе, служащем для подобных задач — “Refresh This”. Однако на сегодня его уже не существует, он благополучно канул в лету. Но ведь потребность в такой задаче у нас осталась.
lazywebtools
Поэтому сегодня мы поговорим о возможности встраивания автообновления страниц прямо в браузер (Chrome, Firefox или Opera), без нужды использования сторонних служб.
Автообновление в Google Chrome
Для того чтобы задействовать автообновление страниц в Chrome, нужно скачать и установить расширение “Auto Refresh Plus” с ресурса Web Store. После установки значок расширения появиться в панели инструментов браузера, в секции расширений. Чтобы включить автообновление выбранной страницы, нужно кликнуть мышью на этом значке. Появится очень простое окошко настроек расширения:
В нем необходимо выбрать интервал времени, через которое будет выполняться автообновление. Можно выбрать заранее заданные величины, а можно установить и свою собственную. И затем нажать кнопку Start . Окно настроек закроется, а на иконке расширения в панели инструментов будет отображаться счетчик, работающий в обратном порядке — на уменьшение. Как только он достигнет заданного значения, страница в окне браузера обновиться автоматически. Чтобы остановить обновление, снова щелкните на иконке расширения и в открывшемся окне нажмите кнопку Stop .
Автообновление в Mozilla Firefox
Для интеграции подобной возможности в браузер Firefox, нужно скачать и установить дополнение “Auto Refresh”, а затем перезагрузить браузер. Теперь открываем интересующую нас страницу и выбираем интервал времени, через который она будет обновляться, путем правого щелчка мыши на иконке дополнения “Auto Refresh”:
В настройках можно выбрать автообновление для отдельной страницы или же для всех открытых вкладок. Помимо прочих настроек, есть и еще один пункт — принудительное обновление страницы “Hard Refresh”. В списке представлены интервалы времени, установленные по умолчанию. Но можно задать и свой собственный, выбрав пункт меню “Customize”.
Автообновление в Opera
Возможность автообновления страниц в браузере Opera встроена по умолчанию, поэтому нет необходимости устанавливать какие-либо расширения. Чтобы задействовать такую функцию, достаточно щелкнуть правой кнопкой мыши на любом месте страницы и выбрать в выпадающем меню интервал обновления в разделе “Reload Every”. В браузере уже заданы интервалы по умолчанию, но можно выставить и свой вручную, перейдя в раздел “Custom”:
Чтобы остановить автообновление страницы, снова откройте контекстное меню и нажмите пункт “Never”.
Заключение
Такими простыми способами можно настроить автообновление страниц в браузерах Google Chrome, Mozilla Firefox и Opera. Но вот для еще одного популярного браузера — Internet Explorer — я так и не нашел ничего подобного. Единственное, что я могу посоветовать людям, пользующимся IE — это перейти на любой из трех названных ранее, чтобы полноценно пользоваться всеми возможностями Интернета.
Jest — использование skip
В Karma\Jasmine есть варианы для игнорирования выборочных тестов — xit, xdescribe. В этом посте — разберусь, какие есть варианты для этог. … Continue reading
Автоматическое обновление страницы
Данная статья будет посвящена тому, как организовать автоматическое обновление страниц. В результате выполнения определенной команды, Ваш браузер будет обновлять страницу через заданный промежуток времени.
Кому может пригодится такой функционал для сайта. Лично я встречал такие циклические обновления на сайтах спортивной тематики. Когда идет какой-то матч в реальном времени, на сайте постоянно ведется текстовая трансляция и чтобы посетители постоянно не обновляли свой браузер, повторно нажимая на кнопку раз за разом, используется автоматическое обновление.
Если Вам нужен такой функционал, то решить поставленную задачу можно несколькими способами.
Самый простой способ осуществляется с помощью HTML, а конкретно с помощью тега meta.
Данную строку нужно добавить в шапке страницы между тегами head. Атообновление будет осуществятся каждые 5 секунд. Если Вам нужно ускорить или замедлить частоту, просто измените число.
Второй способ делает эту же работу, только с помощью JavaScript. Просто добавьте на Вашу страницу, такой вот код:
Время автоматического обновления задано в миллисекундах и составляет 5 секунд.
Последний способ осуществляется уже благодаря PHP. Просто добавьте в код страницы такую строку:
Тут, как и в предыдущих двух способах, время автообновления составляет 5 секунд.
Способ с PHP будет работать только в случаи, если хостинг где лежит Ваш сайт поддерживает PHP. Сейчас в 99% эта функция есть, но все же есть такие хостеры, которые предоставляют дешевые тарифные планы с отсутствием поддержки PHP и баз данных. Такие тарифы используют для размещения одностраничников или простеньких визиток.
Какой из способов выбрать, решать Вам. Главное, чтобы все работало так как нужно. Сделав все правильно, результат не заставит себя ждать.
На этом все, спасибо за внимание. ��
Якщо Вам була корисна моя праця, можете фінансово підтримати сайт або відключити блокувальник реклами, що займе 2 хвилини 🙂
Как настроить автоматическое обновление страницы при написании HTML кода?
Доброго времени суток.
Подскажите пожалуйста, как настроить автоматическое обновление страницы при написании HTML кода (по принципу — я пишу и на втором мониторе в браузере сразу же отображаются изменения)?
Для написания кода пробовал Geany, Bluefish и Brackets.
UPD Пробовал приведенные ниже варианты. Изменения в браузере отображаются автоматически, но только после сохранения кода в редакторе. Может проблема в браузере (использую Google Chrome)?
- Вопрос задан более трёх лет назад
- 25590 просмотров