我有一个使用静态表手动更新的每周计划。
<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>
我有 2 个数组。第一个是类列表:
var compClass = new Array();
compClass[0] = 'al',
compClass[1] = 'be',
compClass[2] = 'ga',
compClass[3] = 'de';
第二个是比赛列表:
var competitions = new Array();
competitions[0] = 'alpha',
competitions[1] = 'beta',
competitions[2] = 'gamma',
competitions[3] = 'delta';
我要做的是匹配 compClass
数组,分别给competitions
大批。我想要它,所以如果 <tr>
类匹配 compClass
之一values,其子元素的内部文本,<td class="competition"></td>
, 将使用相应的 competitions
自动填充值(value)。如果这没有任何意义,这是我正在尝试使用的 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];
});
}
}
});
});
我尝试使用 $.map()
但我无法让它工作。我是 jQuery 的新手——更不用说一般的 JS 了。我究竟做错了什么?谁能提供一些指导?任何帮助将不胜感激。
最佳答案
我建议使用对象:
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];
});
关于javascript - jQuery:使用多个数组来匹配确定 ChildNodes HTML 的类属性?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/19219927/