Example of using the href attribute and onclick event of a tag

Example of using the href attribute and onclick event of a tag

The a tag is mainly used to implement page jump, which can be achieved through the href attribute or in the onclick event.

Copy code
The code is as follows:

<a onclick="window.location.href='www.jb51.net'" href="javascript:void(0);">123WORDPRESS.COM</a>

This code works fine in mainstream browsers, but it will not jump in IE6. What is the reason for this?

Copy code
The code is as follows:

javascript:void(0);

void(arg); can be understood as a function that always returns null, but its parameter cannot be empty. Its parameters can be any expression or even function.

Copy code
The code is as follows:

<a href="javascript:void(name = '123WORDPRESS.COM'); alert(name);">Test</a>

test

IE6 first runs the events bound to the DOM itself, such as onclick; if bubbling is not prevented, the href attributes will be executed sequentially. And void(0); does not need to execute any event, so IE6 tells the browser not to execute any event (overwriting the previous action), and terminating the bubbling is equivalent to return false; so the browser does not execute any action. So just prevent the bubbling event within the onclick event.

Copy code
The code is as follows:

<a onclick="window.location.href='https://www.jb51.net';return false;" href="javascript:void(0);">123WORDPRESS.COM</a>

This will run normally under IE6.

Another way is to use # instead of javascript:void(0);. The # in the href attribute originally means the anchor#name, so when no anchor is specified, it will go to the top of the page. # has a specific meaning. The default is #top. If there is content after #, it will be considered a tag and the corresponding tag will be found on the page to jump to that place. If it is not found, it will jump to the top of the page. If you don't want to jump, you can use ###. ### is a meaningless tag specification.

<<:  Detailed explanation of padding and abbreviations within the CSS box model

>>:  The most comprehensive explanation of the locking mechanism in MySQL

Recommend

How to bind Docker container to external IP and port

Docker allows network services to be provided by ...

How to use lazy loading in react to reduce the first screen loading time

Table of contents use Install How to use it in ro...

About the correct way to convert time in js when importing excel

Table of contents 1. Basics 2. Problem Descriptio...

Detailed explanation of Nginx status monitoring and log analysis

1. Nginx status monitoring Nginx provides a built...

Installation and configuration of MySQL 5.7.17 free installation version

MYSQL version: MySQL Community Server 5.7.17, ins...

Ubuntu 20.04 CUDA & cuDNN Installation Method (Graphical Tutorial)

CUDA installation download cuda Enter the nvidia-...

Implementation steps for building FastDFS file server in Linux

Table of contents 1. Software Package 2. Install ...

Div nested html without iframe

Recently, when doing homework, I needed to nest a ...

Attributes and usage of ins and del tags

ins and del were introduced in HTML 4.0 to help au...

Analysis of Linux configuration to achieve key-free login process

1.ssh command In Linux, you can log in to another...