首页 > 软件开发 > JQUERY >

JQuery如何显示或隐藏不同的Div

来源:互联网 2023-03-17 00:51:24 61

网页编程越来越流程,jquery的使用也越来越广泛,这里一起探讨下利用jquery中的class筛选器隐藏不同的div,如果对您有帮助请帮点赞,谢谢。po8办公区 - 实用经验教程分享!

JQuery如何显示或隐藏不同的Div?po8办公区 - 实用经验教程分享!

工具/原料

  • 编辑器:notepad
  • 浏览器:chrome

方法/步骤

  • 1

    首先创建一个html,html是网页的骨架,然后通过js和css才能做出可交互的美好的网站po8办公区 - 实用经验教程分享!

    JQuery如何显示或隐藏不同的Div?po8办公区 - 实用经验教程分享!

  • 2

    需要注意的是,html中一定要引入jquery的js文件,这里采用的是1.8.0版本,比较老,但是也可以使用po8办公区 - 实用经验教程分享!

    JQuery如何显示或隐藏不同的Div?po8办公区 - 实用经验教程分享!

  • 3

    需要创建几个不同class的div,详见下面的代码,创建了3个divpo8办公区 - 实用经验教程分享!

    JQuery如何显示或隐藏不同的Div?po8办公区 - 实用经验教程分享!

  • 4

    因为之前html中已经创建了两个button,所以这里就可以编写javascript了po8办公区 - 实用经验教程分享!

    通过id进行绑定按钮事件po8办公区 - 实用经验教程分享!

    JQuery如何显示或隐藏不同的Div?po8办公区 - 实用经验教程分享!

  • 5

    通过hide()方法可以隐藏div,通过show()方法可以显示div,这个按钮绑定了事件,只隐藏一个divpo8办公区 - 实用经验教程分享!

    JQuery如何显示或隐藏不同的Div?po8办公区 - 实用经验教程分享!

    JQuery如何显示或隐藏不同的Div?po8办公区 - 实用经验教程分享!

  • 5该信息非法爬取自百度经验
  • 以上方法由办公区教程网编辑摘抄自百度经验可供大家参考!po8办公区 - 实用经验教程分享!


    标签: JQUERYJAVASCRIPT

    办公区 Copyright © 2016-2023 www.bgqu.net. Some Rights Reserved. 备案号:湘ICP备2020019561号统计代码