jquery 与 css相关

最新推荐文章于 2025-08-15 11:16:59 发布

原创最新推荐文章于 2025-08-15 11:16:59 发布 · 304 阅读

0 ·

本内容遵循CC 4.0 BY-SA版权协议

收录于

网站前台

当前文章被收录于：

网站前台

38 篇文章 0 人学习

订阅专栏查看详情

Jquery

当前文章被收录于：

Jquery

6 篇文章 0 人学习

订阅专栏查看详情

div-css

当前文章被收录于：

div-css

5 篇文章 0 人学习

订阅专栏查看详情

当前文章被以下社区和专栏收录：

本文介绍了一个使用jQuery遍历DOM元素并根据索引切换按钮样式的简单案例。通过为不同按钮设置橙色和白色两种样式，展示了如何利用jQuery的each()方法和toggleClass()方法实现界面的动态效果。

1：遍历css 相关dom的值

<script type="text/javascript" src="/js/jquery/jquery-1.8.1.min.js"></script>

<a href="tiepian_add.jsp" title="创建贴片">
<button class="button orange1 medium">创建贴片</button>
</a>
<a href="tiepian_list.jsp" title="贴片列表">
<button class="button orange2 medium">贴片列表</button>
</a>
<a href="tiepian_fabu.jsp" title="已经发布的微信号">
<button class="button orange medium">发布通知</button>
</a>

<script type="text/javascript">
      $(".button").each(function(index,dom){
          if(index==1){
              $(this).toggleClass("orange", false);
              $(this).toggleClass("white", true);
          }else{
              $(this).toggleClass("orange", true);
              $(this).toggleClass("white", false);
          }
      })
</script>