问

使用jQuery从DIV中的列表中包装元素集

woainimamamamama 发布于 2023-02-12 19:02

我有一个很长的名单,每个名字都包含在 span标签中.

例:

Yang Zajicek
Daniela Athey
Alanna Bumpers
Audry Waldron
Agnes Wininger
Tarah Mandelbaum
Dedra Paille
Codi Morrone
Shan Huntoon
Silas Zerangue
Thalia Saleh
Britt Spurlock
Miguelina Dasilva
Scott Scholz
Judith Badura
Alfredia Kidder
Jae Doty
Charise Blakeslee
Yen Axelson
Aurora Cochran
Lavina Crete
Monique Pate
Lady Edelstein
Clark Summitt
Milagros Whetstone
Tracy Tokarski
Wendolyn Crafts
Sandra Clyde
Alyse Giltner
Glennis Roos



现在需要的是我必须经历它们,如循环或使用each(),我需要将这些组包装起来
.我对wrap()基本循环很熟悉,但是我遇到了太多错误,试图确定包装时间和位置模式的逻辑.

包装的模式如下:


遍历所有跨度,将它们分组为5和6,重复此模式直到所有包裹.除了上面提到的类之外,还要添加一个div与项目数相关的第二个类.


最终结果,无论我开始使用多少跨度:


  Yang Zajicek
  Daniela Athey
  Alanna Bumpers
  Audry Waldron
  Agnes Wininger


  Tarah Mandelbaum
  Dedra Paille
  Codi Morrone
  Shan Huntoon
  Silas Zerangue
  Thalia Saleh


  Britt Spurlock
  Miguelina Dasilva
  Scott Scholz
  Judith Badura
  Alfredia Kidder


  Jae Doty
  Charise Blakeslee
  Yen Axelson
  Aurora Cochran
  Lavina Crete
  Monique Pate


  Lady Edelstein
  Clark Summitt
  Milagros Whetstone
  Tracy Tokarski
  Wendolyn Crafts


  Sandra Clyde
  Alyse Giltner
  Glennis Roos


最后一行可以包含1-6个项目,这些项目会有所不同,但是类名称必须遵循"第五行"或"第六行"的模式.CSS将适应这一结果.



        
        1 个回答
        
                        
                这是一个解决方案:

http://jsfiddle.net/QWHYK/

while ($('#list > span').length) {
    $('#list > span:lt(5)').wrapAll('<div class="row five" />');
    $('#list > span:lt(6)').wrapAll('<div class="row six" />');
}


您可以通过一点缓存来改进它,但逻辑就在那里.

        
                
                    2023-02-12 19:05  回答
                       M-When
                
            
                    
    
    
    
        撰写答案
        
            
                
                    回答问题...



    
    
        今天，你开发时遇到什么问题呢？
        立即提问
    

    
        热门标签