0

我有一个 if<span>元素列表，我需要过滤和应用多个操作（文本替换和有条件地添加一个类）。我有以下工作代码：

$('span').filter(function() {
     return $(this).text().toLowerCase()==phrase;
}).text(translation);

$('span').filter(function() { 
     return $(this).hasClass('translatable') && $(this).text().toLowerCase()==phrase;
}).addClass(translated);

这行得通，但显然要通过所有<span>s 两次。是否可以将它们组合成一个迭代，类似于：

$('span').filter(function() { 
     return $(this).text().toLowerCase()==phrase;
}).function() {
     $(this).text(translation);
     if($(this).hasClass('translatable'))
         this.addClass("translated")
}
4

2 回答 2

1

你可以用 jQuery 的 each 方法来做到这一点

$('span').each(function() {
    var $this = $(this);
    if ($this.text().toLowerCase()==phrase){
        $this.text(translate);
        if ( $this.hasClass('translatable') ) {
            $this.addClass("translated");
        }
    }    
});

或者你可以链接方法

$('span').filter(function(){ return $(this).text().toLowerCase()==phrase; })
         .text(translate)
         .filter(function(){ return $(this).hasClass('translatable'); })
         .addClass("translated");

我个人更喜欢第一种方法。虽然它不如第一种漂亮，但它确实是一次迭代，不像第二种方法有四个单独的迭代。通过正确的优化（感谢 Samuel Caillerie），它应该会稍微快一些。

于 2013-04-25T07:49:48.270 回答
1

鉴于phrase您的两个过滤器的测试相同，我可能会这样处理：

$('span').filter(function() {
     return $(this).text().toLowerCase()==phrase;
})
.text(translation)
.filter('.translatable')
.addClass('translated');

也就是说，首先找到包含该短语的跨度并设置它们的文本，然后过滤该集合以获取具有translatable该类的子集并将该类添加'translated'到那些。

于 2013-04-25T08:03:56.443 回答