Our web app is rendered totally on the browser.
The server only talks to the browser through JSON messaging.
As a result, we only need a single page for the app and mostly all the <a>
tags do not have a real href
pointing to other pages.
In my quest of removing unnecessary things I was wondering if I can get rid of the zillions of void(0)
we have in our code, as they seem useless:
<a onclick="fn()">Does not appear as a link, because there's no href</a> <a href="javascript:void(0)" onclick="fn()">fn is called</a> <a href="javascript:" onclick="fn()">fn is called too!</a>
Does anybody knows if using href="javascript:"
can cause a problem?
It works even on IE7...
Please don't spend your valuable time to tell me inline javascript is bad, as this is generated by a template engine :)
Fast-forward to 2013: javascript:void(0) violates Content Security Policy on CSP-enabled HTTPS pages. One option would be then to use href='#' and event.
JavaScript void 0 means returning undefined (void) as a primitive value. You might come across the term “JavaScript:void(0)” while going through HTML documents. It is used to prevent any side effects caused while inserting an expression in a web page.
Generally, you want to avoid href="javascript:void(0)" , as it will cause the browser to parse the value of the link URL, which is both costly and unnecessary. It also introduces a potential XSS security vulnerability, as javascript: URLs violate Content Security Policy (CSP).
It does not cause problems but it's a trick to do the same as PreventDefault
when you're way down in the page and an anchor as:
<a href="#" onclick="fn()">click here</a>
you will jump to the top and the URL will have the anchor #
as well, to avoid this we simply return false;
or use javascript:void(0);
regarding your examples
<a onclick="fn()">Does not appear as a link, because there's no href</a>
just do a {text-decoration:underline;}
and you will have "link a-like"
<a href="javascript:void(0)" onclick="fn()">fn is called</a> <a href="javascript:" onclick="fn()">fn is called too!</a>
it's ok, but in your function
at the end, just return false;
to prevent the default behavior, you don't need to do anything more.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With