Several methods of calling js in a are sorted out and recommended for use

Several methods of calling js in a are sorted out and recommended for use
We often use click events in the a tag:

1. a href="javascript:js_method();"

This is a commonly used method on our platform, but this method is prone to problems when passing parameters such as this. In addition, when the javascript: protocol is used as the href attribute of a, it will not only cause unnecessary triggering of the window.onbeforeunload event, but will also stop the gif animation from playing in IE. W3C standards do not recommend executing JavaScript statements in href

2. a href="javascript:void(0);" onclick="js_method()"

This method is the most commonly used method for many websites and is also the most comprehensive method. The onclick method is responsible for executing the js function, and void is an operator. void(0) returns undefined and the address does not jump. And this method will not directly expose the js method in the browser status bar like the first method.

3.a href="javascript:;" onclick="js_method()"

This method is similar to the previous two methods, the only difference is that an empty js code is executed.

4.a href="#" onclick="js_method()"

This method is also a very common code on the Internet. # is a method built into the tag, representing the function of top. So using this method, after clicking on the web page, you will return to the top of the page.

5.a href="#" onclick="js_method();return false;"

This method returns false after clicking and executing the js function, the page does not jump, and the page remains at the current position after execution.

I looked at Taobao's homepage. They used the second method, while Alibaba's homepage used the first method. The difference between them is that each javascript method in the href is surrounded by try and catch.

To sum up, the most appropriate method to call js function in a is recommended:

Copy code
The code is as follows:

a href="javascript:void(0);" onclick="js_method()"
a href="javascript:;" onclick="js_method()"
a href="#" onclick="js_method();return false;"

<<:  A brief discussion on Flink's fault-tolerant mechanism: job execution and daemon

>>:  Detailed explanation of JavaScript's garbage collection mechanism

Recommend

503 service unavailable error solution explanation

1. When you open the web page, 503 service unavai...

Several common CSS layouts (summary)

Summary This article will introduce the following...

Pull-down refresh and pull-up loading components based on Vue encapsulation

Based on Vue and native javascript encapsulation,...

How to reset the initial value of the auto-increment column in the MySQL table

How to reset the initial value of the auto-increm...

Tips for creating two-dimensional arrays in JavaScript

Creation of a two-dimensional array in Js: First ...

Solution to transparent font problem after turning on ClearType in IE

The solution to the transparent font problem after...

Why is the scroll bar on the web page set on the right?

Why are the scroll bars of the browsers and word ...

A brief analysis of the game kimono memo problem

Today, after the game was restarted, I found that...

Detailed explanation of Linux file operation knowledge points

Related system calls for file operations create i...

How to implement Docker volume mounting

The creation of the simplest hello world output i...

Methods of adaptive web design (good access experience on mobile phones)

1. Add the viewport tag to the HTML header. At th...

How to use the Linux nl command

1. Command Introduction nl (Number of Lines) adds...

MySQL master-slave replication principle and practice detailed explanation

Table of contents Introduction effect principle f...

Linux process management tool supervisor installation and configuration tutorial

Environment: CentOS 7 Official documentation: htt...

Solution to the failure of docker windows10 shared directory mounting

cause When executing the docker script, an error ...