Javascript jQuery：使用多个数组来匹配决定ChildNodes HTML的类属性？

我有一个每周计划，我使用静态表手动更新

<table>
  <tr class="live al tv">
    <td>October 2</td>
    <td>12:30 pm</td>
    <td class="competition"></td>
    <td>Team A v Team B</td>
    <td class="field">1</td>
  </tr>
  <tr class="be tv">
    <td>October 2</td>
    <td>6 pm</td>
    <td class="competition"></td>
    <td>Team C v Team D</td>
    <td class="field">2</td>
  </tr>
  <tr class="ga tv">
    <td>October 3</td>
    <td>12:30 pm</td>
    <td class="competition"></td>
    <td>Team D v Team A</td>
    <td class="field">3</td>
  </tr>
  <tr class="live de tv">
    <td>October 3</td>
    <td>6 pm</td>
    <td class="competition"></td>
    <td>Team C v Team B</td>
    <td class="field">4</td>
  </tr>
</table>

第二个是比赛名单：

var competitions = new Array();
competitions[0] = 'alpha',
competitions[1] = 'beta',
competitions[2] = 'gamma',
competitions[3] = 'delta';

我试图做的是将

compClass

数组分别与

竞赛

数组相匹配。我希望这样，如果

类与

compClass

值之一匹配，则其子元素

的内部文本将使用相应的

值自动填充。如果这没有任何意义，下面是我尝试使用的jQuery：

jQuery(function($){
  $(document).ready(function() {

    var rowClass = $('table tr[class*=" "]'),
        compCell = $('td.competition'),
        fieldCell = $('td.field');

    function setCompetition() {
      for(var i=0;i<compClass.length;++i) {
        $('tr').attr('class',compClass[i]).each(function() {
          this.children[2].innerHTML = competition[i];
        });
      }
    }

  });
});

jQuery（函数（$）{
$（文档）.ready（函数（）{
var rowClass=$（'table tr[class*=“”]），
compCell=$（'td.competition'），
fieldCell=$（'td.field'）；
函数setCompetition（）{
对于（var i=0；i我建议使用对象：

var compClass = {
    'al' : 'alpha',
    'be' : 'beta',
    'ga' : 'gamma',
    'de' : 'delta'
}
var k = Object.keys(compClass);

$('tr[class]').each(function() {
    var prop = $.grep(this.className.split(' '), function(value) {
                    return k.indexOf(value) > -1;
               })[0];

    if (prop) this.children[2].innerHTML = compClass[prop];
});

这应该可以做到：

$.map($("tr"), function(tr, i) {

        $.each(compClass, function(index, someClass){
            if ($(tr).hasClass(someClass)) {
                classIndex = compClass.indexOf(someClass);
                compVal = competitions[classIndex];
                $(tr).find(".competition").each(function() {this.innerHTML = compVal});
            };
        });
    });
});

$.map（）是一个不错的选择。也许你应该分享这段代码？@ColinE这是它的JSFIDLE：
$.map($("tr"), function(tr, i) {

        $.each(compClass, function(index, someClass){
            if ($(tr).hasClass(someClass)) {
                classIndex = compClass.indexOf(someClass);
                compVal = competitions[classIndex];
                $(tr).find(".competition").each(function() {this.innerHTML = compVal});
            };
        });
    });
});