Как обновить (перезагрузить) страницу с помощью JavaScript?

Самый правильный способ: location.reload()

Основной и рекомендуемый метод для перезагрузки страницы — это location.reload(). Он работает во всех современных браузерах и является частью стандарта DOM. Вот как его правильно использовать:

// Простая перезагрузка
location.reload();

// Или с ключевым словом window (для явного указания контекста)
window.location.reload();

Разница между методами

Рассмотрим популярные способы и их особенности:

• location.reload() — перезагружает страницу с тем же URL. Браузер решает, брать ли данные из кэша или с сервера (обычно из кэша, если это возможно). Это аналог нажатия F5.
• location.reload(true) — принудительная перезагрузка с сервера, игнорируя кэш. Параметр true устарел в современных спецификациях, но всё ещё поддерживается браузерами. Лучше использовать location.reload() и управлять кэшем через заголовки HTTP.
• window.location.href = window.location.href — присваивание текущего URL самому себе. Это тоже вызывает перезагрузку, но работает чуть иначе: браузер может добавить запись в историю навигации (как будто вы перешли по новой ссылке). location.reload() историю не меняет.
• window.location.reload(true) — то же самое, что location.reload(true), просто более явное указание контекста.

Как избежать бесконечной перезагрузки

Самая частая ошибка новичков — вызов location.reload() внутри обработчика события, который срабатывает при загрузке страницы. Например:

// НЕПРАВИЛЬНО: вызовет бесконечный цикл
window.addEventListener('load', function() {
    location.reload();
});

Чтобы этого избежать, используйте флаги, проверки или вызывайте перезагрузку только в ответ на действие пользователя (клик, отправка формы):

// ПРАВИЛЬНО: перезагрузка по клику на кнопку
document.getElementById('refreshBtn').addEventListener('click', function() {
    location.reload();
});

// ПРАВИЛЬНО: перезагрузка после отправки формы (если нужно)
document.getElementById('myForm').addEventListener('submit', function(e) {
    e.preventDefault(); // предотвращаем стандартную отправку
    // ... логика отправки данных через fetch/AJAX ...
    // После успешной отправки:
    location.reload();
});

Дополнительные советы

• Если вы используете location.reload() после асинхронной операции (например, fetch), убедитесь, что вызов стоит внутри .then() или await, иначе страница перезагрузится до завершения операции.
• Для мягкого обновления без потери состояния (например, в одностраничных приложениях) лучше не перезагружать страницу, а обновлять только нужные части через DOM-манипуляции.
• Метод location.reload() не принимает аргументов в строгом режиме (ES6+). Параметр true считается устаревшим, но для обратной совместимости работает.

Итог: используйте location.reload() — это самый простой, надёжный и кросс-браузерный способ. Не забывайте вызывать его в нужном контексте (по событию, а не при загрузке), и всё будет работать отлично.

function hardReload() {
    // Добавляем случайный параметр, чтобы сбросить кэш
    window.location.href = window.location.pathname + '?t=' + Date.now();
}

function replaceAndReload() {
    location.replace(location.href);
}