javascript:void(0): что это значит

Если вы вдруг видели конструкцию javascript:void(0) в коде, но не до конца понимали, зачем это нужно, то сегодня будем закрывать этот пробел. Такое часто встречается в HTML, особенно в ссылках, и используется для отмены их стандартного поведения. В общем, посмотрим, что делает javascript:void(0)и когда его стоит, а когда не стоит использовать.

Понимание оператора void

В JavaScript оператор void() используется, когда нужно выполнить выражение, но не возвращать никакого значения (то есть undefined). Проще говоря, он позволяет выполнить код без каких-либо побочных эффектов, связанных с возвратом значений.

Самый частый вариант его использования — тот самый javascript:void(0). Это выражение встречается в HTML-документах, чаще всего в атрибуте href у ссылок. Оно позволяет сделать так, чтобы ссылка никуда не вела и не перезагружала страницу при клике.

Что такое javascript:void(0)

Запись javascript:void(0) — это выражение, которое выполняет код и всегда возвращает undefined. Оно часто используется в HTML-документах, чтобы предотвратить стандартное поведение браузера при выполнении определённых действий.

Чаще всего пишут void 0, потому что 0 — это просто удобная заглушка, но можно подставить любое другое значение (void 1, void true). Главное, что результат всегда будет undefined, а код — предсказуемым.

Синтаксис javascript:void(0)

Синтаксис очень простой, смотрите сами:

void выражение

где выражение — это любой код, который нужно выполнить. И поскольку оператор void всегда возвращает undefined, результат выполнения этого выражения не имеет значения.

Несколько примеров, которые показывают, как работает void:

console.log(void 1); // undefined
void console.log("Это выражение выполнилось, но вернуло undefined");
// Можно использовать в IIFE (немедленно вызываемые функции)
void function() {
    console.log("Функция вызвалась и отработала");
}();

В первом случае void просто игнорирует результат выражения и возвращает undefined. Во втором — выполняет console.log, но не возвращает ничего. В третьем примере void используется перед немедленно вызываемой функцией (IIFE), чтобы явно указать, что её результат не имеет значения.

Примеры использования

Оператор javascript:void(0); чаще всего используется в ссылках и обработчиках событий, когда нужно запустить JavaScript-код без перезагрузки страницы и изменения URL. Это удобно, когда мы хотим:

Дальше разберём подробнее.

Пример использования с onClick

В HTML ссылки <a> по умолчанию ожидают, что у них будет атрибут href с адресом. В принципе, его можно вообще не указывать — ссылка всё равно останется кликабельной, но в разных браузерах поведение может отличаться. Например, может не выглядеть как обычная ссылка (не будет подчёркивания и курсора в виде руки).

Если <a> нужна только для JavaScript (обработка onClick), то часто в href ставят якорную ссылку на какую-то часть страницы, которая в нашем случае не ведёт никуда #:

Нажми меня

Проблема в том, что у # есть побочный эффект: браузер воспринимает его как якорь и при клике либо перебрасывает страницу вверх (если нет других id на странице), либо изменяет URL, добавляя #.

Чтобы этого избежать, вместо # используют javascript:void(0);:

Ссылка

Теперь браузер не будет выполнять переход, а просто запустит JavaScript-код (который всё равно ничего не сделает).

Вывод до нажатия

Допустим, нам нужно, чтобы при клике на ссылку <a> изменялся текст в элементе <p>:

<p id="message">До нажатия</p>
<a href="javascript:void(0);" onclick="changeText();">Нажми меня</a>
<script>
  function changeText() {
    document.getElementById("message").innerText = "После нажатия";
  }
</script>

Что здесь происходит:

В итоге использование javascript:void(0); в href предотвращает перезагрузку страницы и изменение URL.

Вывод после нажатия

Другой вариант — изменить текст самой ссылки, то есть элемента <a>, после клика. Удобно, если нужно показать, что действие уже выполнено.

До нажатия

Что происходит:

Это простой способ динамически менять контент без перезагрузки страницы.

Цвет ссылки

По умолчанию браузеры меняют цвет ссылок после их посещения (обычно с синего на фиолетовый). Но если ссылка <a> использует javascript:void(0), браузер не считает её переходом, и цвет остаётся прежним.

Кликни меня

После клика ссылка не станет посещённой и её цвет не изменится. Это полезно, если хочется сохранить стиль элементов, но при этом обрабатывать клик на JavaScript.

Зачем использовать javascript:void(0)?

Когда нужно выполнить JavaScript-код по клику на ссылку, но при этом не хочется, чтобы страница перезагружалась или куда-то уезжала:

Но javascript:void(0); не единственное решение. Есть способы получше.

Когда избегать использования javascript:void(0)

В 2025 году javascript:void(0); уже не считается хорошей практикой. Сейчас есть более удобные и читаемые способы добиться того же результата. Но в легаси-коде этот приём всё ещё встречается, поэтому полезно понимать, как это работает.

Конструкция javascript:void(0); удобна тем, что её можно вставить прямо в HTML без лишнего кода в JavaScript. Она мгновенно предотвращает переход по ссылке и не требует дополнительных обработчиков. Но главный недостаток — это устаревший стиль написания кода. В современном фронтенде стараются разделять логику и разметку, поэтому инлайновый JavaScript типа href="javascript:void(0); — плохая практика.

Лучше делать так:

В редких случаях void используют, чтобы явно указать, что результат функции должен игнорироваться. Например, void doSomething(); в обработчиках событий, чтобы избежать нежелательных побочных эффектов (если doSomething() что-то возвращает, а браузер интерпретирует это как команду).

Но даже такие сценарии встречаются всё реже, так что лучше использовать современные альтернативы.

Вам слово

Приходите к нам в соцсети поделиться своим мнением о статье и почитать, что пишут другие. А ещё там выходит дополнительный контент, которого нет на сайте: шпаргалки, опросы и разная дурка. В общем, вот тележка, вот ВК — велком!