Group div elements by dynamic class

江枫思渺然 提交于 2021-02-05 09:26:15

问题


I have a day class dynamic:

<div class="day day111">a</div>
<div class="day day111">a</div>
<div class="day day112">a</div>
<div class="day day112">a</div>
<div class="day day113">a</div>

I'm trying to get this:

<div class="group">
    <div class="day day111">a</div>
     <div class="day day111">a</div>
</div>
<div class="group">
    <div class="day day112">a</div>
    <div class="day day112">a</div>
</div>
<div class="group">
    <div class="day day113">a</div>
</div>

I can only do this in javascript. I'm trying with a loop, but I can not group. Can you help me? Thanks!


回答1:


Try

var groups = {};
$('.day').each(function () {
    var className = this.className.match(/(day\d+)/)[1],
        $group = groups[className];
    if (!$group) {
        $group = $('<div />', {
            'class': 'group'
        }).insertAfter(this);
        groups[className] = $group;
    }
    $group.append(this);
})

Demo: Fiddle




回答2:


take a look at this:

$('#box1 >div.day').each(function(){
   var cls = (this.className);

    var group = groups[cls];
    if(!group)
    {
    group = $('<div/>').appendTo('#box2');
    group.addClass('group');

    groups[cls] = group;
    }

    $(this).appendTo(group);
});

http://jsfiddle.net/p3YTS/2/



来源:https://stackoverflow.com/questions/19949400/group-div-elements-by-dynamic-class

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!