JQuery常用的几种显示隐藏的方法

你经常用到的JQuery的显示和隐藏的方法有哪些呢？就主要说一下下面这三种方法吧。

1、JQuery使用
hide() 和 show() 方法来隐藏和显示 HTML 元素；

语法：

$(selector).hide(speed,callback);

$(selector).show(speed,callback);

可选的 speed 参数规定隐藏/显示的速度，可以取以下值："slow"、"fast" 或毫秒。

可选的 callback 参数是隐藏或显示完成后所执行的函数名称。

Show()和hide()所产生的是具有下拉显示和上拉隐藏的动画过程，这和后面说道的方法会有所不同，所以我们要驾驭他们，就必须要学会区别他们。

2、JQuery使用
fadeIn() 和 fadeOut() 方法来淡入和淡出 HTML 元素；

下面是fadeIn()和fadeOut()这两个方法，它产生的动画效果是改变对象透明度的来实现的，通俗点就是淡入淡出效果。fadeIn()是淡入，fadeOut()是淡出。

fadeIn() 用于淡入已隐藏的元素。

语法：

$(selector).fadeIn(speed,callback);

可选的 speed 参数规定效果的时长。它可以取以下值："slow"、"fast" 或毫秒。

可选的 callback 参数是 fading 完成后所执行的函数名称。

fadeOut() 方法用于淡出可见元素。

语法：

$(selector).fadeOut(speed,callback);

可选的 speed 参数规定效果的时长。它可以取以下值："slow"、"fast" 或毫秒。

可选的 callback 参数是 fading 完成后所执行的函数名称。

2、JQuery使用 slideDown() 和 slideUp() 方法来向下滑动元素和向上滑动元素；

和show()和hide()的效果类似就不多说了，看方法：

slideDown() 方法用于向下滑动元素。

语法：

$(selector).slideDown(speed,callback);

可选的 speed 参数规定效果的时长。它可以取以下值："slow"、"fast" 或毫秒。

可选的 callback 参数是滑动完成后所执行的函数名称。

slideUp() 方法用于向上滑动元素。

语法：

$(selector).slideUp(speed,callback);

可选的 speed 参数规定效果的时长。它可以取以下值："slow"、"fast" 或毫秒。

可选的 callback 参数是滑动完成后所执行的函数名称。

还有其他一些方法，下面统一把他们列出来：

淡入淡出效果：

· fadeIn()淡入

· fadeout()淡出

· fadeTo()更改透明度值来产生淡入或者淡出效果

· fadeToggle()淡入淡出效果，集合了fadeIn()和fadeOut()

滑入滑出效果：

· show()向下滑动显示

· hide()向上滑动隐藏

· slideUp()向下滑动显示

· slideDown()向上滑动隐藏

· Toggle()滑动显示和显示，集合了上面的四种方法

· slideToggle()和Toggle()方法一样

最后再来两个方法：借助css()或者animate()修改opacity透明度，或者设置display属性也可以实现显示和隐藏。

转载请注明: JQuery常用的几种显示隐藏的方法 | WEB前端开发