优化多个变量

Question

我会尝试使用jQuery添加一个类。

var tit = ('.tit a'); 
txt_animal = ['pig','horse','rabbit','cat','monkey']; 
txt_fruit = ['melon','apple','kiwi','orange']; 
txt_hobby = ['movie','ski','swim','dance','internet','baseball']; 

$(txt_animal).each(function(i,v){ 
    $(tit + ':contains("'+ v +'")').addClass('tag tag_animal'); 
} 
$(txt_fruit).each(function(i,v){ 
    $(tit + ':contains("'+ v +'")').addClass('tag tag_fruit'); 
} 
$(txt_hobby).each(function(i,v){ 
    $(tit + ':contains("'+ v +'")').addClass('tag tag_hobby'); 
} 

它工作正常。但我认为比这更好的方法。
如何优化JavaScript以获得最佳性能？代替

Answer 1

在下面的代码应该避免两个重复（和昂贵）DOM通过可能的匹配查询和重复迭代，通过使用正则表达式的每个类的标签。

var txt = { 
    animal: /(pig|horse|rabbit|cat|monkey)/i, 
    fruit: /(melon|apple|kiwi|orange)/i, 
    hobby: /(movie|ski|swim|dance|internet|baseball)/i 
}; 

$('.tit a').each(function() { 
    var $this = $(this);  // saves three calls to `$(this)` 
    var t = $this.text();  // get the text contents of the link 

    for (var tag in txt) {  // for each key word 
     if (txt[tag].test(t)) { // test the text against the regexp 
      $this.addClass('tag').addClass('tag_' + tag); 
     } 
    } 
}); 

见http://jsfiddle.net/alnitak/DFcFH/1/

Answer 2

优化DRY。

var tit = ('.tit a'); 
var txt = { 
    "animal": ['pig','horse','rabbit','cat','monkey'], 
    "fruit": ['melon','apple','kiwi','orange'], 
    "hobby": ['movie','ski','swim','dance','internet','baseball'] 
}; 

for (var cat in txt) { 
    $(txt[cat]).each(function(i,v){ 
    $(tit + ':contains("'+ v +'")').addClass('tag tag_' + cat); 
    }); 
}