What does javascript void 0 mean

Question

lt a href  javascript void 0   id  loginlink  gt login lt  a gt    I ve seen such hrefs many times  but I don t know what exactly that means

User · Answer

It is a very popular method of adding JavaScript functions to HTML links.
For example: the [Print] links that you see on many webpages are written like this:

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

Why do we need href while onclick alone can get the job done? Because when users hover over the text 'Print' when there's no href, the cursor will change to a caret (ꕯ) instead of a pointer (👆). Only having href on an a tag validates it as a hyperlink.

An alternative to href="javascript:void(0);", is the use of href="#". This alternative doesn't require JavaScript to be turned on in the user's browser, so it is more compatible.

User · Answer

A link must have an href target to be specified to enable it to be a usable display object  Most browsers will not parse advanced JavaScript in the href of an  lt a gt  element  for example   lt a href  quot javascript var el   document getElementById  foo    quot  gt Get element lt  a gt   Because the href tag in most browsers does not allow whitespace or will convert whitespace to  20  the HEX code for space   the JavaScript interpreter will run into multiple errors  So if you want to use an  lt a gt  element s href to execute inline JavaScript  you must specify a valid value for href first that isn t too complex  doesn t contain whitespace   and then provide the JavaScript in an event attribute tag like onClick  onMouseOver  onMouseOut  etc  The typical answer is to do something like this   lt a href  quot   quot  onclick  quot var el   document getElementById  foo    quot  gt Get element lt  a gt   This works fine but it makes the page scroll to the top because the   in the href tells the browser to do this  Placing a   in the  lt a gt  element s href specifies the root anchor  which is by default the top of the page  but you can specify a different location by specifying the name attribute inside an  lt a gt  element   lt a name  quot middleOfPage quot  gt  lt  a gt   You can then change your  lt a gt  element s href to jump to middleOfPage and execute the JavaScript in the onClick event   lt a href  quot  middleOfPage quot  onclick  quot var el   document getElementById  foo    quot  gt Get element lt  a gt   There will be many times where you do not want that link jumping around  so you can do two things   lt a href  quot  thisLinkName quot  name  quot thisLinkCame quot  onclick  quot var elem   document getElementById  foo    quot  gt Get element lt  a gt   Now it will go nowhere when clicked  but it could cause the page to re-centre itself from its current viewport  The best way to use in-line javascript using an  lt a gt  element s href  but without having to do any of the above is JavaScript void 0     lt a href  quot javascript void 0   quot  onclick  quot var el   document getElementById  foo    quot  gt Get element lt  a gt   This tells the browser no to go anywhere  but instead execute the JavaScript void 0   function in the href because it contains no whitespace  and will not be parsed as a URL  It will instead be run by the compiler  void is a keyword which  when supplied with a parameter of 0 returns undefined  which does not use any more resources to handle a return value that would occur without specifying the 0  it is more memory-management performance friendly   The next thing that happens is the onClick gets executed  The page does not move  nothing happens display-wise

User · Answer

There is a huge difference in the behaviour of   vs javascript void 0      scrolls you to the top of the page but javascript void 0   does not  This is very important if you are coding dynamic pages because the user does not want to go back to the top when they click a link on the page

User · Answer

Usage of javascript void 0  means that the author of the HTML is misusing the anchor element in place of the button element      Anchor tags are often abused with the onclick event to create   pseudo-buttons by setting href to     or  javascript void 0   to   prevent the page from refreshing  These values cause unexpected   behavior when copying dragging links  opening links in a new   tabs windows  bookmarking  and when JavaScript is still downloading    errors out  or is disabled  This also conveys incorrect semantics to   assistive technologies  e g   screen readers   In these cases  it is   recommended to use a  lt button gt  instead  In general you should only use   an anchor for navigation using a proper URL    Source  MDN s  lt a gt  Page

User · Answer

To understand this concept one should first understand the void operator in JavaScript   The syntax for the void operator is  void   expr   which evaluates expr and returns undefined   If you implement void as a function  it looks as follows   function myVoid expr        return undefined      This void operator has one important usage that is - discarding the result of an expression   In some situations  it is important to return undefined as opposed to the result of an expression  Then void can be used to discard that result  One such situation involves javascript  URLs  which should be avoided for links  but are useful for bookmarklets  When you visit one of those URLs  many browsers replace the current document with the result of evaluating the URLs    content     but only if the result isn   t undefined  Hence  if you want to open a new window without changing the currently displayed content  you can do the following   javascript void window open  http   example com

User · Answer

You should always have an href on your a tags  Calling a JavaScript function that returns  undefined  will do just fine  So will linking to       Anchor tags in Internet nbsp Explorer nbsp 6 without an href do not get the a hover style applied   Yes  it is terrible and a minor crime against humanity  but then again so is Internet nbsp Explorer nbsp 6 in general   I hope this helps   Internet nbsp Explorer nbsp 6 is actually a major crime against humanity

User · Answer

It s worth mentioning that you ll sometimes see void 0 when checking for undefined  simply because it requires fewer characters  For example  if  something     undefined        doSomething       Compared to  if  something     void 0        doSomething       Some minification methods replace undefined with void 0 for this reason

User · Answer

The void operator evaluates the given   expression and then returns undefined       The void operator is often used merely   to obtain the undefined primitive   value  usually using    void 0      which   is equivalent to    void 0      In these   cases  the global variable undefined   can be used instead  assuming it has   not been assigned to a non-default   value     An explanation is provided here  void operator   The reason you   d want to do this with the href of a link is that normally  a javascript  URL will redirect the browser to a plain text version of the result of evaluating that JavaScript  But if the result is undefined  then the browser stays on the same page  void 0  is just a short and simple script that evaluates to undefined

User · Answer

Web Developers use javascript void 0  because it is the easiest way to prevent the default behavior of a tag  void  anything   returns undefined and it is a falsy value  and returning a falsy value is like return false in onclick event of a tag that prevents its default behavior  So I think javascript void 0  is the simplest way to prevent the default behavior of a tag

User · Answer

It means it   ll do nothing  It   s an attempt to have the link not    navigate    anywhere  But it   s not the right way   You should actually just return false in the onclick event  like so    lt a href     onclick  return false   gt hello lt  a gt    Typically it   s used if the link is doing some    JavaScript-y    thing  Like posting an AJAX form  or swapping an image  or whatever  In that case you just make whatever function is being called return false   To make your website completely awesome  however  generally you   ll include a link that does the same action  if the person browsing it chooses not to run JavaScript    lt a href  backup page displaying image aspx     onclick  return coolImageDisplayFunction     gt hello lt  a gt

User · Answer

The void operator evaluates the given expression and then returns undefined  It avoids refreshing the page

User · Answer

In addition to the technical answer  javascript void means the author is Doing It Wrong   There is no good reason to use a javascript  pseudo-URL     In practice it will cause confusion or errors should anyone try things like    bookmark link        open link in a new tab     and so on  This happens quite a lot now people have got used to middle-click-for-new-tab  it looks like a link  you want to read it in a new tab  but it turns out to be not a real link at all  and gives unwanted results like a blank page or a JS error when middle-clicked    lt a href     gt  is a common alternative which might arguably be less bad  However you must remember to return false from your onclick event handler to prevent the link being followed and scrolling up to the top of the page   In some cases there may be an actual useful place to point the link to  For example if you have a control you can click on that opens up a previously-hidden  lt div id  foo  gt   it makes some sense to use  lt a href   foo  gt  to link to it  Or if there is a non-JavaScript way of doing the same thing  for example     thispage php show foo    that sets foo visible to begin with   you can link to that   Otherwise  if a link points only to some script  it is not really a link and should not be marked up as such  The usual approach would be to add the onclick to a  lt span gt    lt div gt   or an  lt a gt  without an href and style it in some way to make it clear you can click on it  This is what StackOverflow  did at the time of writing  now it uses href        The disadvantage of this is that you lose keyboard control  since you can t tab onto a span div bare-a or activate it with space  Whether this is actually a disadvantage depends on what sort of action the element is intended to take  You can  with some effort  attempt to mimic the keyboard interactability by adding a tabIndex to the element  and listening for a Space keypress  But it s never going to 100  reproduce the real browser behaviour  not least because different browsers can respond to the keyboard differently  not to mention non-visual browsers    If you really want an element that isn t a link but which can be activated as normal by mouse or keyboard  what you want is a  lt button type  button  gt   or  lt input type  button  gt  is just as good  for simple textual contents   You can always use CSS to restyle it so it looks more like a link than a button  if you want  But since it behaves like a button  that s how really you should mark it up       in site authoring  anyway  Obviously they are useful for bookmarklets  javascript  pseudo-URLs are a conceptual bizarreness  a locator that doesn t point to a location  but instead calls active code inside the current location  They have caused massive security problems for both browsers and webapps  and should never have been invented by Netscape

User · Answer

From what I ve seen  the void operator has 3 common uses in JavaScript  The one that you re referring to   lt a href  quot javascript void 0  quot  gt  is a common trick to make an  lt a gt  tag a no-op  Some browsers treat  lt a gt  tags differently based on whether they have a href   so this is a way to create a link with a href that does nothing  The void operator is a unary operator that takes an argument and returns undefined  So var x   void 42  means x     undefined  This is useful because  outside of strict mode  undefined is actually a valid variable name  So some JavaScript developers use void 0 instead of undefined  In theory  you could also do  lt a href  quot javascript undefined quot  gt  and it would so the same thing as void 0

User · Answer

void is an operator that is used to return a undefined value so the browser will not be able to load a new page   Web browsers will try and take whatever is used as a URL and load it unless it is a JavaScript function that returns null  For example  if we click a link like this    lt a href  javascript  alert  Hello World    gt Click Me lt  a gt    then an alert message will show up without loading a new page  and that is because alert is a function that returns a null value  This means that when the browser attempts to load a new page it sees null and has nothing to load   An important thing to note about the void operator is that it requires a value and cannot be used by itself  We should use it like this    lt a href  javascript  void 0   gt I am a useless link lt  a gt

[javascript] What does "javascript:void(0)" mean?

Examples related to javascript

Examples related to void