This article mainly introduces in detail the difference between the empty link href=# and href=javascript:void(0) in HTML [Transfer], which has certain reference value. Interested friends can refer to it. Friends in need can collect it for easy reference in the future.
In the web language, the writing method of link a is empty is usually written as href=# or href=javascript:void(0). What is the difference between these two writing methods? I think many people won’t go into it, but the effects of these two writing methods are sometimes different. In summary, there are several differences between these two writing methods:
The following example code demonstrates the differences between 1 and 2 points above:
<!doctypehtml><html><head><metacharset=UTF-8><title>aTag empty link href=# and href=javascript:void(0)</title></head><body><pstyle=height:1300px;width:100%;background:#cccccc></p><pstyle=width:100%;p adding:10px;background:#999999><ahref=#>Empty link:href=#</a><br><ahref=javascript:void(0)>Empty link:href=javascript:void(0)</a></p><pstyle=height:100px;width:100%;background:#cccccc></p></body></html>
Use # to locate the specific location of the page:
<!doctypehtml><html><head><metacharset=UTF-8><title>a Tag empty link href=# and href=javascript:void(0)</title></head><body><pstyle=width:100%;padding:10px;background:#999999><ahref=#p1>Jump</title></head><body><pstyle=width:100%;padding:10px;background:#999999><ahref=#p1> Go to the target position: href=#p1</a></p><pstyle=height:100px;width:100%;background:#cccccc></p><pid=p1style=height:1000px;width:100%;padding:10px;background:#999999>Target position: id=p1</p></body></html>
Why use href="javascript:void(0);", when is javascript:void(0) used?
The meaning of href="javascript:void(0);" is to let the hyperlink execute a js function instead of jumping to an address, and void(0) represents an empty method, that is, do not execute the js function.
javascript: is a pseudo-protocol, indicating that the content of the url is executed through javascript. void(0) means that nothing is done, which will prevent the link from jumping to other pages. This is often done to preserve the style of the link, but not allow the link to perform actual operations. The following statement:
<ahref=javascript:void(0)onclick=window.open()>
After clicking on the link, the page does not move and only the link is opened. And the following statement:
<ahref=#onclick=javascript:returnfalse;>
The functions are the same, but different browsers will vary.
In most cases, when a link wants to execute a javascript program, we can use href=javascript:void(0) and add the onclick event to implement it, as shown in the following example code:
<!doctypehtml><html><head><metacharset=UTF-8><title>aTag empty link href=# and href=javascript:void(0)</title></head><body><pstyle=width:100%;padding:10px;background:#999999><ahref=javascript:void(0)onclick=func()>Click to execute function func()</a></p><script>functionfunc(){alert(ok);}</script></body></html>Introduction: void is the operator of javascript, which means: only expressions are executed, but no return value. The expression will be calculated but will not load anything at the current document. For example, void(0) is calculated as 0, but has no effect on JavaScript, that is, the effect of <a href=javascript:void(0)> is the same as <a href=javascript:void(1)>.
The usage format of the void operator is as follows:
javascript: void (expression)//Recommended writing method javascript: void expression
When making a page, if you want to do nothing after clicking a link, or do other things in response to clicking, such as not doing anything after clicking a link, the code is as follows:
<ahref=#>test</a>//Click on the link, and the page scrolls to the top of the page by default, but you can add onclick=returnfalse to prevent scrolling to the top of the page <ahref=###>test</a>//Use 2 to 4#, most of the ones you see are ####, and some other uses #all. By default, it does not scroll to the top of the page <ahref=javascript:void(0);>test</a>//Sina Weibo writing method, javascript:void(0) only represents a dead link, and executes an empty event <ahref=javascript:;>test</a>//QQ space writing method
After clicking on the link, respond to user-defined click events
<ahref=javascript: void(0)onclick=func()>test</a>// where func() is a javascript method, that is, the function <ahref=#onclick=func();returnfalse;>//All problems have been solved, including browser incompatibility issues</a> or directly use href=<ahref=#onclick=alert();event.returnValue=false;>test</a>
In Ajax, the following code is common:
<ahref=javascript:doTest2();void(0);>here</a>But what does void(0) mean here?
In Javascript, void is an operator that specifies that an expression is to be calculated but does not return a value. On Ajax's page, the refresh-free operation is implemented, and void(0) is also used more often. If you look at Ajax's web page, you will usually see a lot of void(0), so before using void(0), you should first think about whether this page needs to be refreshed as a whole.
When making a page, if it is a #, it will jump to the top. There are several solutions to personal collections. Among them, # contains a location information, and the default anchor point is #top, which is the upper end of the web page.
<ahref=###></a><ahref=javascript:void(0)></a><ahref=javascript:void(null)></a><ahref=#onclick=returnfalse></a><spanstyle=cursor:hand></span>(It seems that it cannot be displayed in FF)
The above code package download: https://pan.baidu.com/s/1HSJybrJyvmxSVHsBC7Aikg
The above is the entire content of the difference between the a tag empty link href=# and href=javascript:void(0) in HTML. I hope it will be helpful to everyone's learning and solving problems, and I hope everyone will support Wulin.com more.