Вебинары Разобраться в IT Реферальная программа
Программирование Аналитика Дизайн Маркетинг Управление проектами
06 Июл 2023
2 мин
483

Выбор значения для «href» в JavaScript: «» или «javascript:void(0)»

Общепринятым является использование JavaScript в HTML-ссылках для выполнения определенного кода при нажатии на ссылку. Однако возникает вопрос о том, какой

Общепринятым является использование JavaScript в HTML-ссылках для выполнения определенного кода при нажатии на ссылку. Однако возникает вопрос о том, какой вариант лучше использовать для значения «href» в таких ссылках – «#» или «javascript:void(0)».

Пример проблемы

Рассмотрим два примера кода. В первом используется «#» в качестве значения «href», во втором — «javascript:void(0)».

<a href="#" onclick="myFunction();">Ссылка</a>

или

<a href="javascript:void(0)" onclick="myFunction();">Ссылка</a>

В обоих случаях при нажатии на ссылку будет выполнена функция myFunction(). Важно отметить, что эти два примера работают исключительно при наличии активированного JavaScript в браузере пользователя.

Сравнение «#» и «javascript:void(0)»

При использовании «#» в качестве значения «href», после выполнения JavaScript-кода браузер перемещает пользователя в начало страницы. Это происходит, потому что «#» является якорной ссылкой, которая по умолчанию ведет к началу страницы.

В случае с «javascript:void(0)», после выполнения JavaScript-кода никаких дополнительных действий не происходит. Это связано с тем, что «void(0)» в JavaScript означает «ничего не возвращать». Таким образом, браузер просто выполняет JavaScript-код и ничего больше.

Вывод

В целом, оба варианта можно использовать для запуска JavaScript-кода через HTML-ссылку. Однако, если не нужно, чтобы после выполнения кода страница прокручивалась вверх, лучше использовать «javascript:void(0)».

В любом случае, стоит помнить, что использование JavaScript внутри HTML-атрибутов не считается лучшей практикой. Более предпочтительным является использование метода addEventListener(), который позволяет назначить обработчик события непосредственно в JavaScript-коде, не засоряя HTML.

Проверь как ты усвоил материалы статьи
Пройди тест и узнай насколько ты лучше других читателей

Добавить комментарий