Question

我有许多想要作为群体循环的元素。考虑一下这个HTML：

<input class="matching match-1" />
<input class="matching match-1" />
<input class="matching match-2" />
<input class="matching match-2" />
<input class="matching match-2" />
<input class="matching match-3" />
<input class="matching match-3" />
// etc

我想要一个CSS选择器，它允许我循环遍历这些组，所以会有 - 使用这个例子 - 循环的3次迭代（一次用于match-1，一次用于match-2，一次用于match-3））。 1,2,3等是用于分组的变量，但这不是固定的，因此它不能依赖于这些值的硬编码。这甚至可能吗？我将使用jQuery或原型，而不是真正重要的。

由于

Answer 1

试试这个：

var groups = [];
$(".matching").each(function(index, elem) {
   if (this.className.match(/(?:^|\s+)match-(\d+)(?:\s|$)/)) {
       if (typeof groups[RegExp.$1] == "undefined") {
           groups[RegExp.$1] = [];
       }
       groups[RegExp.$1].push(this);
   }
});

这将使用类匹配迭代元素列表，测试它是否还有 match-x 形式的类，得到 x < / em>并使用 x 作为索引将其添加到匹配组列表中。

Answer 2

在标准CSS2（即目前广泛支持的实现）中，没有任何内容可供您描述。

然而，CSS3有更灵活的选择器，幸运的是它们都是用jQuery实现的。

尝试这样的事情：

$("input[name^='match-']")

这将返回与您尝试执行的操作匹配的DOM节点的jQuery集合。您可以使用经典JS或jQuery的.each()迭代。

Answer 3

使用jQuery：

var indices = {};
var index;

$('.matching').each(function() {
    index = $(this).attr('class').match(/\d+$/);
    indices[index] = index;
});

// Now you have a unique list of matching numbers for your loops

Answer 4

修改

    for(i=0;i<3;i++){
   var str = ".matching-match-" + i;
        $(str).each(function(index) {
           //do something
          });
    }

我希望我能正确理解你的问题。这是你在找什么？

Answer 5

max = parseInt($('.matching:last-child').attr('class').match(/d+/)[0]);
for(i = 1; i <= max; i++) {
  $els = $('.matching.match-'+i.toString());
  // do whatever you want on the group
}

Answer 6

input[class^="matching match-"]应该有效。我不确定你的意思是分组。

修改

var groups = []; var classes = {}; $('input[class^="matching match-"]').each(function() { classes[$(this).attr('class')] = 1; }); for (c in classes) { groups.push($('input[class="'+c+'"]')) }

Answer 7

这可行。没有时间通过XD测试它

var count = 1;
var alreadyCounted = new Array();
$(".matching").each(function(){
    if(typeof alreadyCounted[count] == 'undefined'){
        $('.match-'+count).each(){
            // DWTFYW
        }
        alreadyCounted[count] = true;
    }
    count++;
});

Answer 8

这将构建您的群组列表：

var classList = []
    $('.matching').each(function(i,e) {
        var myClasses = ($(e).attr('class')).split(" ")
        classList[myClasses[1]] = true      
    })

    for (index in classList) {
        alert(index)
        //your code here
    }

用于分组迭代的CSS选择器

8 个答案: