Що робить вираження href <a href=діяjavascript: ;|> </a>?

Я час від часу бачив наступний href, який використовується на веб-сторінках. Однак я не розумію, що це намагається зробити чи техніку. Чи може хтось детальніше просити?

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

<a>Елемент є неприпустимою HTML , якщо він не має або hrefабо nameатрибут.

Якщо ви хочете, щоб воно відображалось правильно у вигляді посилання (тобто підкреслено, вказівник руки тощо), це зробить це лише у тому випадку, якщо він має hrefатрибут.

Таким чином, такий код іноді використовується як спосіб створення посилання, але без необхідності вказувати фактичну URL-адресу в hrefатрибуті. Розробник, очевидно, хотів, щоб сама посилання нічого не робила, і це було найпростішим способом, який він знав.

Він, мабуть, має якийсь код події 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>елемента, а а <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але не як URL-адреса javascript.

Таким чином, це вибір між написанням педантично відповідного стандарту коду, який передбачає необхідність вручну коригувати виклик для кожного гіперпосилання, або трохи нестандартний код, який можна записати один раз і використовувати скрізь.

Тож використовується для запису 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-коди туди, а не лише викликати функції.

Тестовано в хромованій версії 68.0.3440.106 (офіційна збірка) (64-розрядна)

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

Найкращий спосіб завжди візуалізувати посилання належним чином - це css:

a {cursor: pointer !important}

Слід уникати таких непотрібних речей, як згадана нитка.