Question

我试图遍历一个元素列表，这些元素具有ID＃color-lines和每个元素的唯一类，如下所示：<div id="color-lines" class="block-2088">唯一类由WordPress的帖子ID动态驱动，因此每个块都将独一无二。

在每个div中有不同数量的<a>标签，我尝试使用addClass到每个div，具体取决于每个div中有多少个子元素。

    $( "#color-lines" ).each(function(){

        var className = $( this ).attr("class");
        var anchoLink = ( "." + className );

        var n = $( anchoLink ).children().length;

        $( anchoLink ).children().addClass( "line-width-" + n );

    });

即使每个div中有不同数量的<a>元素，每个div元素的每个line-with-n标记都具有相同的类<a>。

Answer 1

切换你的ID和类，换句话说，ID应该是唯一的，类应该用在类似的元素上。您可以使用相同的类为元素编写each()循环：

$(".color-lines").each(function() {
    var n = $(this).children.length;
    $(this).children("a").addClass("line-width-" + n);
});

Answer 2

ID's必须是唯一的，而class可以重复。

使用id作为选择器只返回1个项目，因此$('#color-lines).each仅循环通过第一个#color-lines。

Answer 3

虽然我同意ID应该是唯一的规则，但您可能需要做的是在DIV选择器上添加find（）调用。在这个例子中，我假设您交换了类和ID属性。

$( ".color-lines" ).each(function(){

    $( this ).find("a").addClass( "line-width-" + $(this).children().length );

});

使用jQuery获取每个元素的子元素长度

3 个答案: