【Jquery练习】tab栏切换

2022-12-01 18:55:53 浏览数 (1)

哈喽大家好,本次是jQuery案例练习系列第二期,本期是用jQuery实现tab栏的切换。 笔者还是前端的菜鸟,还请大家多多指教呀~ 欢迎大佬指正,一起学习,一起加油!


文章目录

  • 前言
  • 排他思想
  • 按钮切换
    • HTML、CSS
    • jQuery
  • Tab栏切换实现效果
  • HTML部分
  • CSS部分
  • Jquery部分
  • 总结

前言


排他思想

在实现今天的练习之前,我们先来了解一下排他思想,排他思想也就是为当前元素设置一个特定的样式,并为其他兄弟元素清除样式。多用于多选一的效果。

语法:slibings(selector) 用法:$(“.first”).slibings(“li”)

按钮切换

为了进一步掌握排他思想,我们尝试一下按钮切换吧

0 人点赞