Что делает выражение href <a href="javascript:;"></a>? - PullRequest
200 голосов
/ 13 октября 2011

Я видел следующий href, используемый время от времени на веб-страницах. Тем не менее, я не понимаю, что это пытается сделать или техника. Может кто-нибудь уточнить, пожалуйста?

<a href="javascript:;"></a>

Ответы [ 10 ]

213 голосов
/ 13 октября 2011

Элемент <a> является недопустимым HTML, если он не имеет атрибута href или name.

Если вы хотите, чтобы он правильно отображался как ссылка (т. Е. Подчеркнут, указатель руки и т. Д.)тогда он будет делать это только в том случае, если у него есть атрибут href.

Код, подобный этому, поэтому иногда используется как способ создания ссылки, но без необходимости указывать фактический URL-адрес в hrefприписывать.Разработчик, очевидно, хотел, чтобы сама ссылка ничего не делала, и это было самым простым способом, который он знал.

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

Некоторые разработчики используют href='#' для той же цели, но это заставляет браузер переходить к началу страницы, который может быть не нужен.И он не мог просто оставить поле href пустым, потому что href='' - это ссылка на текущую страницу (т. Е. Она вызывает обновление страницы).

Есть способы обойти это.Использование пустого фрагмента кода Javascript в href является одним из них, и хотя это не лучшее решение, оно работает.

32 голосов
/ 13 октября 2011

, в основном, вместо использования ссылки для перемещения страниц (или якорей), использование этого метода запускает функцию (и) javascript

<script>
function doSomething() {
  alert("hello")
}
</script>
<a href="javascript:doSomething();">click me</a>

при нажатии на ссылку срабатывает предупреждение.

27 голосов
/ 13 декабря 2011

Существует несколько механизмов, позволяющих избежать ссылки на место назначения. Тот из вопроса не очень интуитивно понятен.

Более чистый вариант - использовать href="#no", где #no - неопределенный якорь в документе.

Вы можете использовать более семантическое имя, такое как #disable или #action, чтобы повысить удобочитаемость.

Преимущества подхода:

  • Предотвращает эффект "перемещения наверх" пустого href = "#"
  • Позволяет избежать использования JavaScript

Недостатки:

  • Вы должны быть уверены, что имя якоря не используется в документе.

Поскольку элемент <a> не действует как ссылка, лучшим вариантом в этих случаях является не использование элемента <a>, а <div> и предоставление требуемого стиля ссылки.

9 голосов
/ 13 октября 2011
<a href="javascript:alert('Hello');"></a>

это просто сокращение для:

<a href="" onclick="alert('Hello'); return false;"></a>
8 голосов
/ 13 октября 2014

Обратитесь к этому:

<a href="Http://WWW.stackoverflow.com">Link to the website opened in different tab</a>
<a href="#MyDive">Link to the div in the page(look at the chaneged url)</a>
<a href="javascript:;">Nothing happens if there is no javaScript to render</a>
7 голосов
/ 13 октября 2011

Это способ заставить ссылку ничего не делать при нажатии (если с ней не связаны события Javascript).

Это способ запуска Javascript вместо перехода по ссылке:

<a href="Javascript: doStuff();">link</a>

Когда на самом деле нет JavaScript для запуска (как в вашем примере), он ничего не делает.

4 голосов
/ 13 октября 2011
<a href="javascript:void(0);"></a>

javascript: сообщает браузеру, что нужно написать код JavaScript

3 голосов
/ 16 марта 2015

Старый поток, но я хотел бы добавить, что разработчики используют эту конструкцию не для того, чтобы создать неработающую ссылку, а потому, что URL-адреса javascript по какой-то причине не передают ссылки на активный HTML-элемент правильно.

например. handler_function(this.id) работает как onClick, но не как URL-адрес JavaScript.

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

2 голосов
/ 27 августа 2018

Таким образом, он используется для записи js-кодов внутри href вместо прослушивателей событий, таких как onclick, и избегает # ссылок в href, чтобы сделать a теги действительными для html.

У меня было исследование, как использовать javascript: внутри атрибута href.

<a href="
     javascript:
        a = 4;
        console.log(a++); 
        a += 2; 
        console.log(a++); 
        if(a < 6){ 
            console.log('a is lower than 6');
        } 
        else 
            console.log('a is greater than 6');
        function log(s){
            console.log(s);
        }
        log('function inplimentation working too');

">Click here</a>

С помощью этого кода вы даже можете писать там js-коды, а не только вызывать функции.


Протестировано в Chrome Версия 68.0.3440.106 (Официальная сборка) (64-разрядная версия)

Протестировано в Firefox Quantom 61.0.1 (64-разрядная версия)

0 голосов
/ 20 февраля 2017

Лучший способ всегда правильно отобразить ссылку - использовать css следующим образом:

a {cursor: pointer !important}

Следует избегать ненужных действий, подобных тем, которые упоминаются в теме.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...