Какое значение "href" я должен использовать для ссылок JavaScript, "#" или "javascript: void (0)"?

Question

Ниже приведены два метода создания ссылки, единственной целью которой является выполнение кода JavaScript. Что лучше с точки зрения функциональности, скорости загрузки страницы, целей проверки и т. Д.?

function myJsFunc() {
    alert("myJsFunc");
}

<a href="#" onclick="myJsFunc();">Run JavaScript Code</a>

или

function myJsFunc() {
    alert("myJsFunc");
}

 <a href="javascript:void(0)" onclick="myJsFunc();">Run JavaScript Code</a>

Answer 1

Отредактировано в январе 2019 года

В HTML5 использование элемента без атрибута href равно valid . Он считается «гиперссылкой-заполнителем»

Если элемент a не имеет атрибута href, то этот элемент представляет собой заполнитель для места, где в противном случае могла бы быть размещена ссылка, если бы она была релевантной, состоящей только из содержимого элемента.

Пример:

<a>previous</a>

Если после этого вы хотите сделать иначе:

1 - если ваша ссылка никуда не ведет, не используйте элемент <a>. Используйте <span> или что-то еще подходящее и добавьте CSS :hover, чтобы придать ему стиль.

2 - используйте javascript:void(0) ИЛИ javascript:undefined ИЛИ javascript:;, если хотите быть грубым, точным и быстрым.

Answer 2

Вы можете использовать здесь javascript: void (0) вместо # для остановки перенаправления тега привязки в раздел заголовка.

function helloFunction() {
    alert("hello world");
}
<a href="javascript:void(0)" onclick="helloFunction();">Call Hello Function</a>

Answer 3

Модальности начальной загрузки до 4.0 имеют в основном недокументированное поведение: они загружают href s из a элементов, используя AJAX, если они не равны #. Если вы используете Bootstrap 3, javascript:void(0); hrefs вызовет ошибки JavaScript:

AJAX Error: error GET javascript:void(0);

В этих случаях вам нужно будет обновить до начальной загрузки 4 или изменить href.