Home Web Front-end HTML Tutorial How to use the href attribute and onclick event of a tag

How to use the href attribute and onclick event of a tag

Jan 27, 2018 am 09:26 AM
href Attributes Label

This time I will show you how to use the href attribute of a tag and onclick event, and how to use the href attribute of a tag and onclick eventNotes What are they? Here are actual cases. Let’s take a look. The

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

<a onclick="window.location.href=&#39;www.jb51.net&#39;" href="javascript:void(0);">脚本之家</a>
Copy after login

This code is fine in mainstream browsers, but there will be a problem that it cannot jump under IE6. What is the reason for this?

javascript:void(0);
Copy after login

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

<a href="javascript:void(name = &#39;PHP中文网&#39;); alert(name);">测试</a>
Copy after login

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 events, so IE6 tells the browser not to execute any events (overwriting previous actions), and terminating bubbling is equivalent to return false; so the browser does not execute any actions. So just stop the bubbling event within the onclick event.

The code is as follows:

<a onclick="window.location.href=&#39;http://www.php.cn&#39;;return false;" href="javascript:void(0);">PHP中文网</a>
Copy after login

This way it can run normally under IE6.

Another way is not to use javascript:void(0); but to use # instead. This can also be avoided. The # in the href attribute originally means the anchor point #name, so when If no anchor is specified, it will go to the top of the page. # has a specific meaning, and the default is #top. If there is content after #, it will be considered a tag and the corresponding tag will be jumped to there if found on the page. If it cannot be found, it will jump to the top of the page. If you do not want to jump, , you can use

,

is a meaningless label specification.

I believe you have mastered the methods after reading these cases. For more exciting information, please pay attention to other related articles on the php Chinese website!

Related reading:
How to use the cellpadding attribute and cellspacing attribute of HTML


How to use the header structure in HTML What is the difference between disabled and readonly using


in HTML?

######

The above is the detailed content of How to use the href attribute and onclick event of a tag. For more information, please follow other related articles on the PHP Chinese website!

Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn

Hot AI Tools

Undresser.AI Undress

Undresser.AI Undress

AI-powered app for creating realistic nude photos

AI Clothes Remover

AI Clothes Remover

Online AI tool for removing clothes from photos.

Undress AI Tool

Undress AI Tool

Undress images for free

Clothoff.io

Clothoff.io

AI clothes remover

Video Face Swap

Video Face Swap

Swap faces in any video effortlessly with our completely free AI face swap tool!

Hot Tools

Notepad++7.3.1

Notepad++7.3.1

Easy-to-use and free code editor

SublimeText3 Chinese version

SublimeText3 Chinese version

Chinese version, very easy to use

Zend Studio 13.0.1

Zend Studio 13.0.1

Powerful PHP integrated development environment

Dreamweaver CS6

Dreamweaver CS6

Visual web development tools

SublimeText3 Mac version

SublimeText3 Mac version

God-level code editing software (SublimeText3)

How to search for text across all tabs in Chrome and Edge How to search for text across all tabs in Chrome and Edge Feb 19, 2024 am 11:30 AM

This tutorial shows you how to find specific text or phrases on all open tabs in Chrome or Edge on Windows. Is there a way to do a text search on all open tabs in Chrome? Yes, you can use a free external web extension in Chrome to perform text searches on all open tabs without having to switch tabs manually. Some extensions like TabSearch and Ctrl-FPlus can help you achieve this easily. How to search text across all tabs in Google Chrome? Ctrl-FPlus is a free extension that makes it easy for users to search for a specific word, phrase or text across all tabs of their browser window. This expansion

Python's dir() function: View the properties and methods of an object Python's dir() function: View the properties and methods of an object Nov 18, 2023 pm 01:45 PM

Python's dir() function: View an object's properties and methods, specific code example required Summary: Python is a powerful and flexible programming language, and its built-in functions and tools provide developers with many convenient features. One of the very useful functions is the dir() function, which allows us to view the properties and methods of an object. This article will introduce the usage of the dir() function and demonstrate its functions and uses through specific code examples. Text: Python’s dir() function is a built-in function.

What is the clock behind the TikTok label? How to tag Douyin account? What is the clock behind the TikTok label? How to tag Douyin account? Mar 24, 2024 pm 03:46 PM

When browsing Douyin works, we often see a clock icon behind the tag. So, what exactly is this clock? This article will focus on the discussion of &quot;What is the clock behind the Douyin label&quot;, hoping to provide some useful reference for your use of Douyin. 1. What is the clock behind the Douyin label? Douyin will launch some hot topic challenges. When users participate, they will see a clock icon after the tag, which means that the work is participating in the topic challenge and displays the remaining time of the challenge. For some time-sensitive content, such as holidays, special events, etc., Douyin will attach a clock icon after the label to remind users of the validity period of the content. 3. Popular tags: When a tag becomes popular, Douyin will add a clock icon after the tag to indicate that the tag is

How to add tags on Douyin to attract traffic? Which tags on the platform are easiest to attract traffic to? How to add tags on Douyin to attract traffic? Which tags on the platform are easiest to attract traffic to? Mar 22, 2024 am 10:28 AM

As a popular short video social platform, Douyin has a huge user base. For Douyin creators, using tags to attract traffic is an effective way to increase the exposure of content and attract attention. So, how does Douyin use tags to attract traffic? This article will answer this question in detail for you and introduce related techniques. 1. How to add tags on Douyin to attract traffic? When posting a video, make sure to choose tags that are relevant to the content. These tags should cover the topic and keywords of your video to make it easier for users to find your video through tags. Leveraging popular hashtags is an effective way to increase your video’s exposure. Research current popular tags and trends and incorporate them into your video descriptions and tags. These popular tags usually have higher visibility and can attract the attention of more viewers. 3. Label

bottom attribute syntax in CSS bottom attribute syntax in CSS Feb 21, 2024 pm 03:30 PM

Bottom attribute syntax and code examples in CSS In CSS, the bottom attribute is used to specify the distance between an element and the bottom of the container. It controls the position of an element relative to the bottom of its parent element. The syntax of the bottom attribute is as follows: element{bottom:value;} where element represents the element to which the style is to be applied, and value represents the bottom value to be set. value can be a specific length value, such as pixels

A closer look at the video element in HTML A closer look at the video element in HTML Feb 24, 2024 pm 08:18 PM

Detailed explanation of the video tag in HTML The video tag in HTML5 is a tag used to play videos on web pages. It can render videos using different formats, such as MP4, WebM, Ogg, and more. In this article, we will introduce the use of video tag in detail and provide specific code examples. Basic Structure The following is the basic structure of the video tag:

Introduction to the attributes of Hearthstone's Despair Thread Introduction to the attributes of Hearthstone's Despair Thread Mar 20, 2024 pm 10:36 PM

Thread of Despair is a rare card in Blizzard Entertainment's masterpiece &quot;Hearthstone&quot; and has a chance to be obtained in the &quot;Wizbane's Workshop&quot; card pack. Can consume 100/400 arcane dust points to synthesize the normal/gold version. Introduction to the attributes of Hearthstone's Thread of Despair: It can be obtained in Wizbane's workshop card pack with a chance, or it can also be synthesized through arcane dust. Rarity: Rare Type: Spell Class: Death Knight Mana: 1 Effect: Gives all minions a Deathrattle: Deals 1 damage to all minions

What is the role of pageXOffset attribute in JavaScript? What is the role of pageXOffset attribute in JavaScript? Sep 16, 2023 am 09:17 AM

If you want to get the pixels to which the document is scrolled from the upper left corner of the window, use the pageXoffset and pageYoffset properties. Use pageXoffset for horizontal pixels. Example You can try running the following code to learn how to use the pageXOffset attribute in JavaScript - Live Demonstration<!DOCTYPEhtml><html> <head> <style> &amp

See all articles