Wat doet “javascript:void(0)” bedoel?

Ik heb zulke href‘s vaak gezien, maar ik weet niet wat dat precies betekent.

Antwoord 1, autoriteit 100%

De operator void evalueert het gegeven
expressie en retourneert vervolgens undefined.

De operator void wordt vaak alleen gebruikt
om de primitieve undefined te verkrijgen
waarde, meestal met void(0) (die
is gelijk aan void 0 ). In deze
gevallen, de globale variabele undefined
kan in plaats daarvan worden gebruikt (ervan uitgaande dat het heeft)
niet toegewezen aan een niet-standaard
waarde).

Hier vindt u een uitleg: void operator.

De reden dat u dit zou willen doen met de href van een link is dat normaal gesproken een javascript: URL de browser omleidt naar een platte tekstversie van het resultaat van de evaluatie van dat JavaScript. Maar als het resultaat undefined is, blijft de browser op dezelfde pagina. void(0) is slechts een kort en eenvoudig script dat resulteert in undefined.

Antwoord 2, autoriteit 41%

Naast het technische antwoord, betekent javascript:void dat de auteur het verkeerd doet.

Er is geen goede reden om een ​​javascript: pseudo-URL(*) te gebruiken. In de praktijk zal het voor verwarring of fouten zorgen als iemand dingen probeert als ‘bladwijzerlink’, ‘link openen in een nieuw tabblad’, enzovoort. Dit gebeurt nogal veel nu mensen gewend zijn geraakt aan middenklik-voor-nieuw-tabblad: het lijkt op een link, je wilt het in een nieuw tabblad lezen, maar het blijkt helemaal geen echte link te zijn, en geeft ongewenste resultaten zoals een lege pagina of een JS-fout wanneer er met de middelste muisknop op wordt geklikt.

<a href="#"> is een veelgebruikt alternatief dat aantoonbaar minder slecht is. U moet er echter aan denken om return false te retourneren vanuit uw onClick gebeurtenishandler om te voorkomen dat de link wordt gevolgd en naar de bovenkant van de pagina scrolt.

In sommige gevallen kan er een daadwerkelijk bruikbare plaats zijn om de link naar te verwijzen. Als je bijvoorbeeld een besturingselement hebt waarop je kunt klikken en dat een eerder verborgen <div id="foo"> opent, is het logisch om <a href="#foo"> om ernaar te linken. Of als er een niet-JavaScript-manier is om hetzelfde te doen (bijvoorbeeld thispage.php?show=foo die foo zichtbaar instelt om mee te beginnen), kunt u daar naar linken.

Anders, als een link alleen naar een script verwijst, is het niet echt een link en moet het niet als zodanig worden gemarkeerd. De gebruikelijke aanpak zou zijn om de onClick toe te voegen aan een <span>, <div>, of een href zonder een href en vorm het op een bepaalde manier zodat het duidelijk is dat je erop kunt klikken. Dit is wat StackOverflow [deed op het moment van schrijven; nu gebruikt het href="#"].

Het nadeel hiervan is dat je de controle over het toetsenbord verliest, omdat je niet op een span/div/bare-a kunt tikken of deze met spatie kunt activeren. Of dit daadwerkelijk een nadeel is, hangt af van het soort actie dat het element moet ondernemen. Je kunt, met enige moeite, proberen de interactie van het toetsenbord na te bootsen door een tabIndex aan het element toe te voegen en te luisteren naar een spatietoets. Maar het zal nooit het echte browsergedrag 100% reproduceren, niet in de laatste plaats omdat verschillende browsers anders op het toetsenbord kunnen reageren (om nog maar te zwijgen van niet-visuele browsers).

Als je echt een element wilt dat geen link is maar dat normaal kan worden geactiveerd met de muis of het toetsenbord, dan wil je een <button type="button"> ( of <input type="button"> is net zo goed, voor eenvoudige tekstuele inhoud). Je kunt altijd CSS gebruiken om het opnieuw op te maken, zodat het meer op een link dan op een knop lijkt, als je wilt. Maar aangezien het zich gedraagt ​​als een knop, moet je het zo markeren.

(*: in ieder geval bij het maken van sites. Ze zijn duidelijk handig voor bookmarklets. javascript: pseudo-URL’s zijn conceptueel bizar: een locator die niet naar een locatie verwijst, maar in plaats daarvan actieve code op de huidige locatie. Ze hebben enorme beveiligingsproblemen veroorzaakt voor zowel browsers als webapps en hadden nooit door Netscape mogen worden uitgevonden.)

Antwoord 3, autoriteit 12%

Het betekent dat het niets zal doen. Het is een poging om de link nergens te ‘navigeren’. Maar het is niet de juiste manier.

Je zou eigenlijk gewoon return false moeten retourneren in de onClick-gebeurtenis, zoals:

<a href="#" onclick="return false;">hello</a>

Het wordt meestal gebruikt als de link iets ‘JavaScript-achtig’ doet. Zoals het plaatsen van een AJAX-formulier, of het verwisselen van een afbeelding, of wat dan ook. In dat geval geef je de functie die wordt aangeroepen gewoon return false terug.

Om uw website echter helemaal geweldig te maken, voegt u over het algemeen een link toe die dezelfde actie uitvoert, als de persoon die erop surft ervoor kiest geen JavaScript uit te voeren.

<a href="backup_page_displaying_image.aspx"
   onclick="return coolImageDisplayFunction();">hello</a>

Antwoord 4, autoriteit 7%

Het is een zeer populaire methode om JavaScript-functies toe te voegen aan HTML-links.
Bijvoorbeeld: de [Print]-links die u op veel webpagina’s ziet, zijn als volgt geschreven:

<a href="javascript:void(0)" onclick="callPrintFunction()">Print</a>

Waarom hebben we href nodig terwijl alleen onClick de klus kan klaren? Omdat wanneer gebruikers over de tekst ‘Afdrukken’ gaan terwijl er geen href is, de cursor verandert in een caret (ꕯ) in plaats van een aanwijzer (👆). Alleen het hebben van href op een a-tag valideert het als een hyperlink.

Een alternatief voor href="javascript:void(0);", is het gebruik van href="#". Voor dit alternatief hoeft JavaScript niet te zijn ingeschakeld in de browser van de gebruiker, dus het is beter compatibel.

Antwoord 5, autoriteit 7%

Er is een groot verschil in het gedrag van # versus JavaScript:void(0);.

# schuift je naar de bovenkant van de pagina, maar JavaScript:void(0); niet.

Dit is erg belangrijk als u dynamische pagina’s codeert, omdat de gebruiker niet terug wil naar de top wanneer hij op een link op de pagina klikt.

Antwoord 6, autoriteit 4%

Je moet altijd een href op je a-tags hebben. Het aanroepen van een JavaScript-functie die ‘undefined’ retourneert, is prima. Dat geldt ook voor het linken naar ‘#’.

Ankertags in Internet Explorer 6 zonder een href krijgen de a:hover-stijl niet toegepast.

Ja, het is verschrikkelijk en een kleine misdaad tegen de menselijkheid, maar dat geldt ook voor Internet Explorer 6 in het algemeen.

Ik hoop dat dit helpt.

Internet Explorer 6 is eigenlijk een grote misdaad tegen de menselijkheid.

Antwoord 7, autoriteit 3%

Het is vermeldenswaard dat u soms void 0 ziet wanneer u controleert op ongedefinieerd, simpelweg omdat er minder tekens nodig zijn.

Bijvoorbeeld:

if (something === undefined) {
    doSomething();
}

Vergeleken met:

if (something === void 0) {
    doSomething();
}

Sommige minificatiemethoden vervangen om deze reden undefined door void 0.

Antwoord 8, autoriteit 2%

Gebruik van javascript:void(0) betekent dat de auteur van de HTML het ankerelement misbruikt in plaats van het knopelement.

Ankertags worden vaak misbruikt om de onclick-gebeurtenis aan te maken
pseudo-knoppen door href in te stellen op “#” of “javascript:void(0)” op
voorkomen dat de pagina wordt vernieuwd. Deze waarden veroorzaken onverwachte
gedrag bij het kopiëren/slepen van links, het openen van links in een nieuwe
tabbladen/vensters, bladwijzers en wanneer JavaScript nog aan het downloaden is,
fouten uit of is uitgeschakeld. Dit brengt ook onjuiste semantiek over naar:
ondersteunende technologieën (bijv. schermlezers). In deze gevallen is het
aanbevolen om in plaats daarvan een <button> te gebruiken. Over het algemeen mag u alleen
een anker voor navigatie met behulp van een juiste URL.

Bron: MDN’s href Pagina.

Antwoord 9, autoriteit 2%

void is een operator die wordt gebruikt om een ​​undefined waarde te retourneren, zodat de browser geen nieuwe pagina kan laden.

Webbrowsers zullen proberen alles wat als URL wordt gebruikt te nemen en te laden, tenzij het een JavaScript-functie is die null retourneert. Als we bijvoorbeeld op een link als deze klikken:

<a href="javascript: alert('Hello World')">Click Me</a>

dan verschijnt er een waarschuwingsbericht zonder een nieuwe pagina te laden, en dat komt omdat alert een functie is die een null-waarde retourneert. Dit betekent dat wanneer de browser een nieuwe pagina probeert te laden, deze null ziet en niets hoeft te laden.

Een belangrijk ding om op te merken over de void-operator is dat deze een waarde vereist en niet op zichzelf kan worden gebruikt. We zouden het als volgt moeten gebruiken:

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

Antwoord 10, autoriteit 2%

Webontwikkelaars gebruiken javascript:void(0) omdat dit de gemakkelijkste manier is om het standaardgedrag van a-tag te voorkomen. void(*anything*) retourneert undefined en het is een valse waarde. en het retourneren van een false-waarde is als return false in onClick-gebeurtenis van a-tag die zijn standaardgedrag voorkomt.

Dus ik denk dat javascript:void(0) de eenvoudigste manier is om het standaardgedrag van a-tag te voorkomen.

Antwoord 11

Om dit concept te begrijpen, moet men eerst de void-operator in JavaScript begrijpen.

De syntaxis voor de void-operator is: void «expr» die expr evalueert en undefined retourneert.

Als je void implementeert als een functie, ziet het er als volgt uit:

function myVoid(expr) {
    return undefined;
}

Deze void-operator heeft één belangrijk gebruik, namelijk – het weggooien van het resultaat van een uitdrukking.

In sommige situaties is het belangrijk om undefined te retourneren in plaats van het resultaat van een expressie. Dan kan void worden gebruikt om dat resultaat te negeren. Een voorbeeld van zo’n situatie is javascript: URL’s, die moeten worden vermeden voor links, maar die nuttig zijn voor bookmarklets. Wanneer u een van die URL’s bezoekt, vervangen veel browsers het huidige document door het resultaat van de evaluatie van de URL’s ‘inhoud’, maar alleen als het resultaat niet ongedefinieerd is. Als u dus een nieuw venster wilt openen zonder de momenteel weergegeven inhoud te wijzigen, kunt u het volgende doen:

javascript:void window.open("http://example.com/")

Antwoord 12

De operator void evalueert de gegeven uitdrukking en retourneert vervolgens undefined.
Het voorkomt dat de pagina wordt vernieuwd.

Antwoord 13

Een link moet een href-doel hebben dat moet worden opgegeven om het een bruikbaar weergaveobject te maken.

De meeste browsers zullen geen geavanceerd JavaScript ontleden in de href van een href-element, bijvoorbeeld:

<a href="javascript:var el = document.getElementById('foo');">Get element</a>

Omdat de href-tag in de meeste browsers geen witruimte toestaat of witruimte omzet in %20 (de HEX-code voor spatie), zal de JavaScript-interpreter meerdere fouten.

Dus als u de href van een href-element wilt gebruiken om inline JavaScript uit te voeren, moet u een geldige waarde opgeven voor href eerst dat niet te complex is (geen witruimte bevat), en vervolgens het JavaScript in een gebeurteniskenmerktag zoals onClick, onMouseOver, onMouseOut, enz.

Het typische antwoord is om zoiets als dit te doen:

<a href="#" onclick="var el = document.getElementById('foo');">Get element</a>

Dit werkt prima, maar de pagina scrolt naar boven omdat de # in de href de browser vertelt dit te doen.

Het plaatsen van een # in de href van het href-element specificeert het hoofdanker, dat standaard bovenaan de pagina staat, maar u kunt een andere locatie opgeven door het kenmerk name op te geven in een href-element.

<a name="middleOfPage"></a>

U kunt dan de href van uw href-element wijzigen om naar middleOfPage te springen en het JavaScript uit te voeren in de onClick evenement:

<a href="#middleOfPage" onclick="var el = document.getElementById('foo');">Get element</a>

Er zullen vaak momenten zijn waarop je niet wilt dat die link rondspringt, dus je kunt twee dingen doen:

<a href="#thisLinkName" name="thisLinkCame" onclick="var elem = document.getElementById('foo');">Get element</a>

Nu zal het nergens heen gaan als erop wordt geklikt, maar het kan ertoe leiden dat de pagina zichzelf opnieuw centreert vanuit de huidige viewport.

De beste manier om in-line javascript te gebruiken met behulp van de href van een href-element, maar zonder een van de bovenstaande dingen te doen, is JavaScript:void(0);:

<a href="javascript:void(0);" onclick="var el = document.getElementById('foo');">Get element</a>

Dit vertelt de browser nergens heen, maar voert in plaats daarvan de functie JavaScript:void(0); uit in de href omdat deze geen witruimte bevat en niet worden geparseerd als een URL. Het wordt in plaats daarvan uitgevoerd door de compiler.

void is een trefwoord dat, indien geleverd met een parameter van 0, undefined retourneert, dat geen bronnen meer gebruikt om een retourwaarde die zou optreden zonder de 0 op te geven (het is meer geheugenbeheer/prestatievriendelijk).

Het volgende dat gebeurt, is dat de onClick wordt uitgevoerd. De pagina beweegt niet, er gebeurt niets qua weergave.

Antwoord 14

Van wat ik heb gezien, de operator void heeft 3 veelvoorkomende toepassingen in JavaScript. Degene waar je naar verwijst, <a href="javascript:void(0)"> is een veelgebruikte truc om een ​​href tag een no-op. Sommige browsers behandelen href-tags anders op basis van het feit of ze een href hebben, dus dit is een manier om een ​​link te maken met een href dat doet niets.

De operator void is een unaire operator die een argument aanneemt en undefined retourneert. Dus var x = void 42; betekent x === undefined. Dit is handig omdat, buiten strikte modus, undefined eigenlijk een geldige variabelenaam. Dus sommige JavaScript-ontwikkelaars gebruiken void 0 in plaats van undefined. In theorie zou je ook <a href="javascript:undefined"> kunnen doen en het zou hetzelfde zijn als void(0).