<a href="javascript:void(0)" id="loginlink">login</a>
Ich habe so href
viele Male gesehen, aber ich weiß nicht genau, was das bedeutet.
javascript
void
Oh mein Gott
quelle
quelle
javascript:
ist eines der vielen URI-Schemata: en.wikipedia.org/wiki/URI_scheme , likedata:
.href="javascript:"
für den gleichen Zweck verwenden. Wie in der Antwort auf diese Frage angegeben , war dervoid(0)
Teil ursprünglich für frühere Versionen von Browsern gedacht, bei denen diejavascript:
URI-Behandlung unterschiedlich war. Aber jetzt konnte ich nicht einmal eine Version finden, in der die Kurzschrift nicht funktionieren würde, zumindest IE7 behandelt dies korrekt.Antworten:
Hier wird eine Erklärung gegeben:
void
Operator .Der Grund, warum Sie dies mit
href
einem Link tun möchten, ist, dass normalerweise einejavascript:
URL den Browser zu einer Nur-Text-Version des Ergebnisses der Auswertung dieses JavaScript umleitet. Wenn das Ergebnis jedoch istundefined
, bleibt der Browser auf derselben Seite.void(0)
ist nur ein kurzes und einfaches Skript, das ausgewertet wirdundefined
.quelle
Zusätzlich zur technischen Antwort
javascript:void
bedeutet dies , dass der Autor es falsch macht.Es gibt keinen guten Grund, eine
javascript:
Pseudo-URL (*) zu verwenden. In der Praxis führt dies zu Verwirrung oder Fehlern, wenn jemand Dinge wie "Lesezeichen-Link", "Link in einem neuen Tab öffnen" usw. ausprobiert. Dies passiert ziemlich oft, jetzt haben sich die Leute daran gewöhnt, mit der mittleren Maustaste auf einen neuen Tab zu klicken: Es sieht aus wie ein Link, Sie möchten ihn in einem neuen Tab lesen, aber es stellt sich heraus, dass es sich überhaupt nicht um einen echten Link handelt. und gibt unerwünschte Ergebnisse wie eine leere Seite oder einen JS-Fehler, wenn Sie mit der mittleren Maustaste klicken.<a href="#">
ist eine häufige Alternative, die möglicherweise weniger schlecht ist. Sie müssen jedoch daran denken,return false
von Ihremonclick
Ereignishandler zu erfahren, dass der Link nicht verfolgt wird und Sie zum oberen Rand der Seite scrollen.In einigen Fällen kann es einen tatsächlich nützlichen Ort geben, auf den der Link verweist. Wenn Sie beispielsweise ein Steuerelement haben, auf das Sie klicken können, um ein zuvor ausgeblendetes Steuerelement zu öffnen
<div id="foo">
, ist es sinnvoll,<a href="#foo">
eine Verknüpfung zu diesem Steuerelement zu verwenden . Oder wenn es eine Nicht-JavaScript-Methode gibt, mit der Sie dasselbe tun können (z. B. 'thispage.php? Show = foo', mit der foo zunächst sichtbar gemacht wird), können Sie darauf verlinken.Wenn ein Link nur auf ein Skript verweist, handelt es sich nicht wirklich um einen Link und sollte nicht als solcher gekennzeichnet werden. Die übliche Vorgehensweise wäre der hinzufügen
onclick
zu einem<span>
,<div>
oder ein ,<a>
ohne einehref
in irgendeiner Weise und Stil es , um es Sie können es zu machen deaktivieren Sie. Dies hat StackOverflow [zum Zeitpunkt des Schreibens getan; jetzt benutzt eshref="#"
].Dies hat den Nachteil, dass Sie die Tastaturkontrolle verlieren, da Sie nicht auf ein span / div / bare-a tippen oder es mit Leerzeichen aktivieren können. Ob dies tatsächlich ein Nachteil ist, hängt davon ab, welche Art von Aktion das Element ausführen soll. Mit etwas Aufwand können Sie versuchen, die Interaktionsfähigkeit der Tastatur nachzuahmen, indem Sie
tabIndex
dem Element ein hinzufügen und auf einen Space-Tastendruck warten. Aber es wird niemals das reale Browserverhalten zu 100% reproduzieren, nicht zuletzt, weil verschiedene Browser unterschiedlich auf die Tastatur reagieren können (ganz zu schweigen von nicht visuellen Browsern).Wenn Sie wirklich ein Element möchten, das kein Link ist, aber wie gewohnt per Maus oder Tastatur aktiviert werden kann, möchten Sie ein
<button type="button">
(oder<input type="button">
ist genauso gut für einfache Textinhalte). Sie können es jederzeit mit CSS neu formatieren, sodass es eher wie ein Link als wie eine Schaltfläche aussieht, wenn Sie möchten. Aber da es sich wie ein Knopf verhält, sollten Sie ihn wirklich so markieren.(*: jedenfalls beim Erstellen von Websites. Offensichtlich sind sie für Lesezeichen nützlich.
javascript:
Pseudo-URLs sind eine konzeptionelle Bizarrheit: Ein Locator, der nicht auf einen Standort verweist, sondern aktiven Code innerhalb des aktuellen Standorts aufruft. Sie haben massive Sicherheit verursacht Probleme sowohl für Browser als auch für Webanwendungen und sollten niemals von Netscape erfunden worden sein.)quelle
href
s durchgeführt, einschließlich Macken und Nebenwirkungen. Einige von Ihnen finden es vielleicht nützlich: jakub-g.github.com/accessibility/onclickvoid(0)
wird in vielen Fällen benötigt; "#" ist ein Hack, der eine ganze Reihe von Problemen mit sich bringt (es würde in der App, die ich schreibe, nicht funktionieren, die mich auf diese Seite gebracht hat).preventDefault
es nicht verwendet wird. Bitte tun Sie dies nicht, wenn ein Anker als Schaltfläche in einem Formular verwendet wird.Es bedeutet, dass es nichts tun wird. Es ist ein Versuch, den Link nirgendwo "navigieren" zu lassen. Aber es ist nicht der richtige Weg.
Sie sollten eigentlich nur
return false
für denonclick
Fall, so:Normalerweise wird es verwendet, wenn der Link eine 'JavaScript-y'-Sache macht. Zum Beispiel ein AJAX-Formular veröffentlichen oder ein Bild austauschen oder was auch immer. In diesem Fall machen Sie einfach die Funktion, die als return bezeichnet wird
false
.Um Ihre Website jedoch vollständig zu optimieren, fügen Sie im Allgemeinen einen Link hinzu, der dieselbe Aktion ausführt, wenn die Person, die sie durchsucht, JavaScript nicht ausführt.
quelle
<a href="enableJavaScriptToSeeMyCompletelyAwesomeSite.html" onclick="completelyAwesome();return false;">
.Es gibt einen RIESIGEN Unterschied im Verhalten von "#" gegenüber Javascript: void
"#" führt Sie zum oberen Rand der Seite, während "javascript: void (0);" nicht.
Dies ist sehr wichtig, wenn Sie dynamische Seiten codieren. Der Benutzer möchte nicht nach oben zurückkehren, nur weil er auf einen Link auf der Seite geklickt hat.
quelle
false
zum Ereignishandler zurückkehren:onclick="doSomething();return false;"
oder wenn SiedoSomething()
zurückkehrenfalse
, können Sie verwendenonclick="return doSomething();"
.e.preventDefault()
."#"
nicht nicht nach oben bewegen , wenn Sie false zurück.Es ist eine sehr beliebte Methode zum Hinzufügen von JavaScript-Funktionen zu HTML-Links.
Beispiel: Die
[Print]
Links, die Sie auf vielen Webseiten sehen, sind wie folgt geschrieben:Warum brauchen wir
href
Verweilenonclick
allein kann den Job zu erledigen? Denn wenn Benutzer mit der Maus über den Text 'Drucken' fahren, wenn keine vorhanden isthref
, ändert sich der Cursor in ein Caret (ꕯ) anstelle eines Zeigers (👆). Nur wenn Siehref
eina
Tag haben, wird es als Hyperlink validiert.Eine Alternative zu
href="javascript:void(0);"
ist die Verwendung vonhref="#"
. Für diese Alternative muss JavaScript nicht im Browser des Benutzers aktiviert sein, daher ist sie kompatibler.quelle
href
den Zeiger der zeigenden Hand nicht erhalten. Alles was es braucht ist ein bisschen CSS.<a href="javascript:callPrintFunction()">
ist es sauberer (obwohl es wahrscheinlichbutton
eher eina
Nchor als ein Nchor sein sollte, wenn es Sie eigentlich nirgendwohin bringt).href="#"
kann zu bösen Überraschungen führen - wie abgebrochene xhr-Anfragen, die zufällig durch Klicken auf diesen Link aufgerufen werden. Ich hatte kürzlich Schwierigkeiten, eine Website zu debuggen, bei der die angeforderte OIDC-Anmeldung abgebrochen wurde, wenn sich der Benutzer zufällig an einer Adresse befand, die nicht das Stammverzeichnis der Website war.#
href veranlasste es, die Adresse neu zu laden, bevor die xhr-Anfrage abgeschlossen wurde.Sie sollten immer eine href auf Ihren a- Tags haben. Das Aufrufen einer JavaScript-Funktion, die 'undefined' zurückgibt, reicht völlig aus. Dies gilt auch für die Verknüpfung mit '#'.
Bei Anker-Tags in Internet Explorer 6 ohne href wird der
a:hover
Stil nicht angewendet.Ja, es ist schrecklich und ein kleines Verbrechen gegen die Menschlichkeit, aber auch Internet Explorer 6 im Allgemeinen.
Ich hoffe das hilft.
Internet Explorer 6 ist tatsächlich ein schweres Verbrechen gegen die Menschlichkeit.
quelle
Es ist erwähnenswert, dass manchmal null 0 angezeigt wird, wenn nach undefinierten Zeichen gesucht wird, einfach weil weniger Zeichen erforderlich sind.
Zum Beispiel:
vs.
Einige Minifizierungsmethoden ersetzen aus diesem Grund undefiniert durch void 0.
quelle
void 0
. Der Unterschied von 3 Zeichen summiert sich schnell, wenn viele Methoden Standardparameterwerte verwenden.Verwendung von
javascript:void(0)
bedeutet, dass der Autor des HTML-Codes das Ankerelement anstelle des Schaltflächenelements missbraucht.Quelle: MDN-
<a>
Seite .quelle
void
ist ein Operator, mit dem einundefined
Wert zurückgegeben wird, sodass der Browser keine neue Seite laden kann.Webbrowser versuchen, alles, was als URL verwendet wird, zu verwenden und zu laden, es sei denn, es handelt sich um eine JavaScript-Funktion, die null zurückgibt. Wenn wir zum Beispiel auf einen Link wie diesen klicken:
Dann wird eine Warnmeldung angezeigt, ohne dass eine neue Seite
alert
geladen wird. Dies liegt daran, dass eine Funktion einen Nullwert zurückgibt. Dies bedeutet, dass der Browser beim Versuch, eine neue Seite zu laden, null sieht und nichts zu laden hat.Ein wichtiger Punkt beim Void-Operator ist, dass er einen Wert benötigt und nicht alleine verwendet werden kann. Wir sollten es so verwenden:
quelle
Um dieses Konzept zu verstehen, sollte man zuerst den void-Operator in JavaScript verstehen.
Die Syntax für den void-Operator lautet:
void «expr»
ausgewertet expr und gibt undefiniert zurück.Wenn Sie void als Funktion implementieren, sieht es folgendermaßen aus:
Dieser void-Operator hat eine wichtige Verwendung: das Verwerfen des Ergebnisses eines Ausdrucks.
In einigen Situationen ist es wichtig, undefiniert im Gegensatz zum Ergebnis eines Ausdrucks zurückzugeben. Dann kann void verwendet werden, um dieses Ergebnis zu verwerfen. Eine solche Situation betrifft Javascript: URLs, die für Links vermieden werden sollten, aber für Lesezeichen nützlich sind. Wenn Sie eine dieser URLs besuchen, ersetzen viele Browser das aktuelle Dokument durch das Ergebnis der Auswertung des URL-Inhalts, jedoch nur, wenn das Ergebnis nicht undefiniert ist. Wenn Sie also ein neues Fenster öffnen möchten, ohne den aktuell angezeigten Inhalt zu ändern, können Sie Folgendes tun:
quelle
function myVoid(expr) { expr(); return undefined; }
Sie haben vergessen, expr ()expr
wird bereits beimmyVoid()
Aufruf ausgewertet (das Ergebnis dieses Ausdrucks wird als Parameter übergeben)function() { alert("foo"); }
ist ein gültiger Ausdruck .void(function() { alert("foo"); })
Renditenundefined
und ist nicht zeigen die Warnung, währendmyVoid(function() { alert("foo"); })
bedeutet (in Ihrer Version, nicht die von Gopal Yadav ).Der
void
Operator wertet den angegebenen Ausdruck aus und gibt dann undefiniert zurück. Es wird vermieden, die Seite zu aktualisieren.quelle
Webentwickler verwenden,
javascript:void(0)
weil dies der einfachste Weg ist, das Standardverhalten vona
Tags zu verhindern .void(*anything*)
kehrt zurückundefined
und es ist ein falscher Wert. und einen falsy Wertes Rückkehr ist wiereturn false
inonclick
Fall -a
Tag , das sein Standardverhalten zu verhindern.Daher denke ich, dass dies
javascript:void(0)
der einfachste Weg ist, um das Standardverhalten vona
Tags zu verhindern .quelle
Für einen Link muss ein HREF-Ziel angegeben werden, damit er als verwendbares Anzeigeobjekt verwendet werden kann.
Die meisten Browser analysieren kein erweitertes JavaScript in einem
Tag wie:
Da das HREF-Tag in den meisten Browsern keine Leerzeichen zulässt oder Leerzeichen in% 20 konvertiert, entspricht das HEX einem Leerzeichen, wodurch Ihr JavaScript für den Interpreter absolut unbrauchbar wird.
Wenn Sie also ein A HREF-Tag zum Ausführen von Inline-JavaScript verwenden möchten, müssen Sie einen gültigen Wert für HREF FIRST angeben, der nicht zu komplex ist (kein Leerzeichen enthält), und dann das JavaScript in einem Ereignisattribut-Tag wie OnClick bereitstellen , OnMouseOver, OnMouseOut usw.
Die typische Antwort lautet:
Dies funktioniert einwandfrei, aber die Seite springt nach oben, da das Nummernzeichen / Hash-Tag sie dazu auffordert.
Wenn Sie lediglich ein Nummernzeichen / Hash-Tag in einem A HREF-Tag angeben, wird der Stammanker angegeben. Dies ist immer standardmäßig der obere Rand der Seite. Sie können einen anderen Speicherort angeben, indem Sie das NAME-Attribut in einem A HREF-Tag angeben.
Sie können dann Ihr A HREF-Tag ändern, um zu 'middleofpage' zu springen und das JavaScript im OnClick-Ereignis auszuführen, sobald dies wie folgt geschieht:
Es wird VIELE Male geben, in denen Sie nicht möchten, dass dieser Link herumspringt, also können Sie zwei Dinge tun:
Jetzt wird es beim Klicken nirgendwo hingehen, aber es könnte dazu führen, dass sich die Seite aus dem aktuellen Ansichtsfenster neu zentriert. Das ist nicht schön. Was ist der beste Weg, um Inline-Javascript mit einem A HREF bereitzustellen, ohne jedoch die oben genannten Schritte ausführen zu müssen? JavaScript: void (0);
Dies weist den Browser an, NIRGENDWO zu gehen, aber stattdessen das gültige JavaScript auszuführen: void (0); Funktionieren Sie zuerst im HREF-Tag, da es kein Leerzeichen enthält und nicht als URL analysiert wird. Es wird stattdessen vom Compiler ausgeführt. VOID ist ein Schlüsselwort, das, wenn es mit einem Parameter von 0 angegeben wird, UNDEFINED zurückgibt und keine weiteren Ressourcen verwendet, um einen Rückgabewert zu verarbeiten, der ohne Angabe der 0 auftreten würde (es ist speicherverwaltungs- / leistungsfreundlicher).
Als nächstes wird der OnClick ausgeführt. Die Seite bewegt sich nicht, es passiert nichts in Bezug auf die Anzeige.
quelle
<a>
Element immer irgendwohin gehen muss ; Wenn es nur auf der Seite ist, um Javascript auszuführen,<button>
sollte stattdessen a verwendet werden. Die Verwendung<button>
ist sowohl semantischer als auch erspart Ihnen diese ganze Debatte darüber, was Sie in einen Anker hacken sollenhref
. Bearbeiten: Es sieht so aus, als ob die Antwort von @Ronnie Royston unten dieses Argument bereits behandelt hat.JavaScript: URLs beiseite; Hier kann void nützlich sein, um kürzeren Code zu schreiben.
quelle