欢迎您光临自学哈网,只为分享网络知识教程,供大家学习参考!

「自学哈网」JQuery如何切换元素的可见状态并添加样式/删除样式切换代码

作者 : 自学哈 本文共495个字,预计阅读时间需要2分钟 2023-05-9 共99人阅读
也想出现在这里? 联系我们

JQuery如何切换元素的可见状态并添加样式/删除样式切换代码

 

JQuery切换元素的可见状态,添加样式/删除样式切换代码

 

toggle() 切换元素的可见状态。如果元素是可见的,切换为隐藏的;如果元素是隐藏的,切换为可见的。

 

示例:

 

切换所有段落的可见状态。

 

HTML 代码:

 

<p>Hello</p><p style=”display: none”>Hello Again</p>

 

jQuery 代码:

 

$(“p”).toggle()

 

结果:

 

<p tyle=”display: none”>Hello</p><p style=”display: block”>Hello Again</p>

 

使用示例代码:

 

<script>

$(document).ready(function(){

 

$(“.index_nav_box span”).toggle(function(){

//添加样式

$(“.index_nav”).addClass(“fadeInUp”);

}), function(){

//删除样式

$(“.index_nav”).removeClass(“fadeInUp”);

});

 

});

</script>

本站声明:
本站所有资源来源于网络,分享目的仅供大家学习和交流!如若本站内容侵犯了原著者的合法权益,可联系邮箱976157886@qq.com进行删除。
自学哈专注于免费提供最新的分享知识、网络教程、网络技术的资源分享平台,好资源不私藏,大家一起分享!

自学哈网 » 「自学哈网」JQuery如何切换元素的可见状态并添加样式/删除样式切换代码
也想出现在这里? 联系我们
© 2022 Theme by - 自学哈网 & WordPress Theme. All rights reserved 浙ICP备2022016594号