Question

我使用下面的代码动态地用span填充字符。

    $("span.count").children().andSelf().contents().each(function(){
    if (this.nodeType == 3) {
        var $this = $(this);
        $this.replaceWith($this.text().replace(/(\w)/g, "<span>$&</span>"));
    }
});

我正在尝试（一旦完成）计算包装元素的数量，以便我可以根据数量将类附加到其容器中。我尝试了各种方法（认为我的问题是尝试计算动态创建的内容），但似乎没有任何方法。以下是我到目前为止：

    var n = $("span.count").live().children().length;
if (n < 3) {
    $(".counter").addClass("four");
}

非常感谢任何帮助。

Answer 1

您可以向要插入的<span>添加一个类，然后计算该类的数量。

Answer 2

您不能按照您尝试的方式使用.live()。它现在都已弃用，仅用于委派事件处理，而不用于DOM更改。如果您在要添加的范围中添加一个类，那么您只需计算它：

$("span.count").children().andSelf().contents().each(function(){
    if (this.nodeType == 3) {
        var $this = $(this);
        $this.replaceWith($this.text().replace(/(\w)/g, "<span class="letter">$&</span>"));
    }
});

var cnt = $(".letter").length;

或者，您可以使用自定义替换功能并在每次替换时增加计数器：

var spanCnt = 0;
$("span.count").children().andSelf().contents().each(function(){
    if (this.nodeType == 3) {
        var $this = $(this);
        $this.replaceWith($this.text().replace(/(\w)/g, function(match) {
            ++spanCnt;
            return("<span>" + match + "</span>");
        }));
    }
});

计算动态创建的元素的数量

2 个答案: