查看 621
回复 0
jQuery 实现收缩元素功能 复制链接
发表于 2022-4-27 11:18:50 显示全部楼层 阅读模式 来自 中国四川绵阳
本帖最后由 逆风天 于 2022-4-27 11:25 编辑

jQuery 实现收缩元素功能

有这样一个布局


  

   

          
  1. <ul>
  2.   <li></li>
  3.   <li></li>
  4.   <li></li>
  5.   <li>从我开始</li>
  6.   <li></li>
  7.   <li></li>
  8.   <li></li>
  9.   <li></li>
  10.   <div class="give-me"></div>
  11. </ul>

  12.    

  

  复制代码

我想只显示前3个 li 元素,剩下的收缩到.give-me元素中,该如何实现呢?
非常简单,使用jQuery 的.nextUntil()方法。
具体代码如下:


  

   

          
  1. var test =$('ul>li:nth-child(3)').nextUntil('div.give-me');

  2.    

  

  复制代码

意思是,取得ul下第3个li到div.give-me之间的元素,并赋值到 test。
然后 就阔以 通过jQuery的append,将获取到的test装入.give-me元素中了。

您需要登录后才可以回帖

登录

Or

立即注册

在线咨询 快速回复 返回列表