it-swarm.com.de

Ist ein Ankertag ohne das Attribut href sicher?

Ist es in Ordnung, ein Ankertag zu verwenden, ohne das href-Attribut einzuschließen und stattdessen einen JavaScript-Click-Ereignishandler zu verwenden? Ich würde also die href vollständig weglassen, nicht einmal leer haben (href="").

212
john

In HTML5 ist die Verwendung eines a-Elements ohne ein href-Attribut gültig. Es wird als "Platzhalter-Hyperlink" betrachtet. 

Beispiel:

<a>previous</a>

Suchen Sie nach "Platzhalter-Hyperlink" auf der Referenzseite des W3C-Anker-Tags: https://www.w3.org/TR/2016/REC-html51-20161101/textlevel-semantics.html#the-a-element

Und es wird hier auch im Wiki erwähnt: https://www.w3.org/wiki/Elements/a

Eine Platzhalterverknüpfung ist für Fälle, in denen Sie ein Ankerelement verwenden möchten, dieses jedoch nirgendwo navigieren soll. Dies ist praktisch, wenn Sie die aktuelle Seite in einem Navigationsmenü oder Breadcrumb-Pfad markieren möchten. (Der alte Ansatz wäre gewesen, entweder ein span-Tag oder ein Anker-Tag mit einer Klasse namens "active" oder "current" zu verwenden, um es zu formatieren, und JavaScript, um die Navigation abzubrechen.) 

Ein Platzhalter-Link ist auch nützlich, wenn Sie zur Laufzeit dynamisch das Ziel des Links über JavaScript festlegen möchten. Sie legen einfach den Wert des Attributs href fest und das Ankertag kann anklickbar sein.

Siehe auch: 

190
dthrasher

Es ist in Ordnung, kann aber gleichzeitig dazu führen, dass einige Browser langsam werden.

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

Mein Rat lautet: <a href="#"> </a>

Wenn Sie JQuery verwenden, denken Sie daran, auch Folgendes zu verwenden:

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

Kurze Antwort: Nein.

Lange Antwort:

Erstens ist es ohne ein href-Attribut kein Link. Wenn es sich nicht um einen Link handelt, kann nicht über die Tastatur (oder den Atemschalter oder ein anderes nicht auf Zeiger basierendes Eingabegerät) zugegriffen werden (es sei denn, Sie verwenden HTML 5-Funktionen von tabindex, die nicht allgemein unterstützt werden). Es ist sehr selten, dass ein Steuerelement keinen Zugriff auf die Tastatur hat.

Zweite. Sie sollten eine Alternative haben, wenn das JavaScript nicht ausgeführt wird (weil das Laden vom Server langsam war, eine Internetverbindung unterbrochen wurde (z. B. ein mobiles Signal in einem fahrenden Zug), JS deaktiviert ist usw. usw.). 

Verwenden Sie progressive Erweiterung by unauffälliges JS.

25
Quentin

Das Tag kann ohne href-Attribut verwendet werden. Im Gegensatz zu vielen Antworten gibt es eigentlich übliche Gründe, um einen Anker zu erstellen, wenn es keine href gibt. Semantisch bedeutet "a" einen Anker oder eine Verknüpfung. Wenn Sie es für etwas verwenden, das dieser Bedeutung folgt, dann geht es Ihnen gut.

Eine Standardanwendung des Tags a ohne href ist das Erstellen von benannten Links. Auf diese Weise können Sie einen Anker mit name = blah verwenden. Später können Sie einen Anker mit href = # blah erstellen, um eine Verknüpfung mit dem benannten Abschnitt der aktuellen Seite herzustellen. Dies ist jedoch veraltet, da Sie IDs auch auf dieselbe Weise verwenden können. Als Beispiel könnten Sie ein Header-Tag mit id = header verwenden, und später könnten Sie einen Anker haben, der auf den Header href = # verweist.

Mein Punkt ist jedoch nicht die Verwendung der name-Eigenschaft. Geben Sie nur einen Anwendungsfall an, bei dem Sie keine href benötigen, und begründen Sie, warum dies nicht erforderlich ist.

12
monokrome

Wenn Sie für die Rückwärtskompatibilität href verwenden müssen, können Sie auch verwenden

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

anstelle von #, wenn Sie das Attribut nicht verwenden möchten

12
Rasive

Aus Sicht der Barrierefreiheit ist <a> ohne href nicht tabulierbar. Alle Links sollten tabulierbar sein. Fügen Sie also tabindex = '0 "hinzu, wenn Sie keine href haben. 

8
user3862605

Das <a>-Tag ohne "href" kann hilfreich sein, wenn Sie Menüs mit mehreren Ebenen verwenden. Sie müssen die nächste Ebene erweitern, möchten jedoch nicht, dass diese Menübezeichnung eine aktive Verknüpfung ist. Ich hatte noch nie Probleme damit.

7
Jon

In einigen Browsern haben Sie Probleme, wenn Sie kein href-Tag angeben. Ich schlage vor, dass Sie Ihren Code wie folgt schreiben:

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

sie können yourcode () durch Ihre eigene Funktion oder Logik ersetzen; Aussage am Ende.

1
shashwat13

Ich konnte diese Arbeit machen:

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

und es ignoriert den Klick. Dann benutze ich jQuery, um den "Dumb-Button" -Klick zu fangen und meinen Code auszulösen (einige divs ausblenden/div anzeigen).

0
Ron Richardson