Безопасен ли тег привязки без атрибута href?

Question

Можно ли использовать тег привязки, не включая атрибут href, а вместо этого используя обработчик событий щелчка JavaScript?Поэтому я бы опускал href полностью, даже если бы он не был пустым (href="").

Answer 1

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

Пример:

<a>previous</a>

Найдите «гиперссылку-заполнитель» на странице ссылки тега привязки w3c: https://www.w3.org/TR/2016/REC-html51-20161101/textlevel-semantics.html#the-a-element.

И она также упоминается навики здесь: https://www.w3.org/wiki/Elements/a

Ссылка-заполнитель предназначена для случаев, когда вы хотите использовать элемент привязки, но нигде не перемещаться.Это удобно для разметки текущей страницы в навигационном меню или в журнале.(Старый подход заключался в использовании тега span или тега привязки с классом с именем «active» или «current» для его стилизации и JavaScript для отмены навигации.)

Полезно также использовать ссылку-заполнительв случаях, когда вы хотите динамически установить назначение ссылки через JavaScript во время выполнения.Вы просто устанавливаете значение атрибута href, и тег привязки становится активируемым.

См. Также:

• https://stackoverflow.com/a/10510353/19112
• http://www.html5in24hours.com/2012/06/8-ways-to-get-started-with-html5-today/
• http://webdesign.about.com/od/html5tutorials/qt/html5-placeholder-links.htm

Answer 2

Это нормально, но в то же время может вызвать замедление работы некоторых браузеров.

http://webdesignfan.com/yslow-tutorial-part-2-of-3-reducing-server-calls/

Мой совет - использование

Если вы используете JQuery, не забудьте также использовать:

.click(function(event){
    event.preventDefault();
    // Click code here...
});

Answer 3

Краткий ответ: Нет.

Длинный ответ:

Во-первых, без атрибута href это не будет ссылка.Если это не ссылка, то она не будет доступна с клавиатуры (или переключателя дыхания, или другого устройства ввода, не основанного на указателе) (если вы не используете функции HTML 5 tabindex, которые не поддерживаются повсеместно).Очень редко уместно, чтобы элемент управления не имел доступа к клавиатуре.

Второй.У вас должна быть альтернатива для случаев, когда JavaScript не запускается (из-за медленной загрузки с сервера, было прервано интернет-соединение (например, мобильный сигнал в движущемся поезде), JS выключен и т. Д. И т. Д.).

Используйте прогрессивное улучшение от ненавязчивый JS.

Answer 4

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

<a href="javascript:void(0)">link</a>

вместо #, если вы не хотите использовать атрибут

Answer 5

Тег можно использовать без атрибута href. Вопреки многим ответам здесь, на самом деле есть стандартные причины для создания якоря, когда нет href. Семантически, «а» означает якорь или ссылку. Если вы используете это для чего-то, что следует этому значению, тогда у вас все в порядке.

Одно стандартное использование тега без ссылки - это создание именованных ссылок. Это позволяет вам использовать якорь с name = blah, а позже вы можете создать якорь с href = # blah для ссылки на именованный раздел текущей страницы. Тем не менее, это устарело, потому что вы также можете использовать идентификаторы таким же образом. Например, вы можете использовать тег заголовка с id = header и позже вы можете иметь привязку, указывающую на заголовок href = #.

Однако я не советую использовать свойство name. Только для предоставления одного варианта использования, где вам не нужен href, и, следовательно, обоснование, почему оно не требуется.

Answer 6

С точки зрения доступности <a> без href не поддерживает табуляцию, все ссылки должны иметь вкладку, поэтому добавьте tabindex = '0 ", если у вас нет href.

Answer 7

Тег <a> без «href» может быть полезен при использовании многоуровневых меню, и вам нужно расширить следующий уровень, но не нужно, чтобы эта метка меню была активной ссылкой.У меня никогда не было проблем с его использованием.

Answer 8

Мне удалось сделать эту работу:

<a id="dumb-button" href="#" onclick="return false;">Link</a>

и игнорирует щелчок. Затем я использую jQuery, чтобы поймать щелчок «немой кнопки» и вызвать мой код (скрыть некоторые элементы div / показать элемент div).

Answer 9

В некоторых браузерах вы столкнетесь с проблемами, если не будете указывать тег href.Я предлагаю вам написать свой код примерно так:

<a href="#" onclick="yourcode();return false;">Link</a>

вы можете заменить свой код () своей собственной функцией или логикой, но не забудьте добавить return false;заявление в конце.