How jquery hides and shows the a tag

This article mainly introduces the relevant knowledge of "how jquery hides and shows a tag". The editor shows you the operation process through an actual case. The method of operation is simple, fast and practical. I hope this article "how to hide and show a tag in jquery" can help you solve the problem.

Three implementation methods: 1, with "$(" a "). Toggle (); 2, with" $("a"). SlideToggle (); "; 3, with" $("a"). FadeToggle (); ". All three methods check the visible state of the a tag, hide it if it is displayed, and show it if it is hidden.

The operating environment of this tutorial: windows7 system, jquery1.10.2 version, Dell G3 computer.

Jquery can use the following three built-in methods to hide and show elements

Toggle () method

SlideToggle () method

FadeToggle () method

1. Use the toggle () method

The toggle () method switches between hide () and show () on the selected element.

This method checks the visible state of the selected element. If an element is hidden, run show (), and if an element is visible, run hide ()-this has the effect of a state switch between hiding and showing.

$(document) .ready (function () {$("button") .click (function () {$("a"). Toggle ();}) A tag hyperlink

Hide and show a tag

2. Use the slideToggle () method

The slideToggle () method switches between slideUp () and slideDown () on the selected element.

This method checks the visible state of the selected element. If an element is hidden, run slideDown (), and if an element is visible, run slideUp ()-this has the effect of a state switch between hiding and showing.

$(document) .ready (function () {$("button") .click (function () {$("a"). SlideToggle ();}) A tag hyperlink

Hide and show a tag

3. Use the fadeToggle () method

The fadeToggle () method switches between the fadeIn () and fadeOut () methods.

If the elements are faded out, fadeToggle () displays them using the fade effect.

If elements are faded in, fadeToggle () displays them using the fade-out effect.

$(document) .ready (function () {$("button") .click (function () {$("a"). FadeToggle ();}) A tag hyperlink

Hide and show a tag

This is the end of the introduction to "how jquery hides and displays a tags". Thank you for reading. If you want to know more about the industry, you can follow the industry information channel. The editor will update different knowledge points for you every day.