Что делает выражение href <a href= Организацииjavascript:;oted> </a>?

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

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

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

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

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

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

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

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

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

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

щелкнув ссылку, вы получите предупреждение.

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

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

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

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

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

Недостатки:

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

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

<a href="javascript:alert('Hello');"></a>

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

<a href="" onclick="alert('Hello'); return false;"></a>

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

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

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

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

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

<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>

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

javascript: говорит браузеру писать код JavaScript

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

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

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

Поэтому он используется для написания 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-битная версия)

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

a {cursor: pointer !important}

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