用Jquery遍历html表
用Jquery遍历html表
提问于 2017-05-03 13:03:19
我有一个不确定行的HTML表，但是有一个已知的列数。对于每一行，我需要找到每个td有一个“空闲”类。然后，我需要检查后面的第三个td，如果它也有一个“免费”类，我需要在原始td中添加一个类"start“。举个例子，有6个tds的tr看起来是这样的；
<tr>
<td class="free"></td>
<td class="free"></td>
<td class="free"></td>
<td class="free"></td>
<td class="free"></td>
<td class="not-free"></td>
<td class="not-free"></td>
</tr>然后看起来是这样的：
<tr>
<td class="free start"></td>
<td class="free start"></td>
<td class="free"></td>
<td class="free"></td>
<td class="free"></td>
<td class="not-free"></td>
<td class="not-free"></td>
</tr>我可以找到每个td的索引，但不确定如何找到以下第三个索引。
$('td.free').each(function() {
var this_unit = $(this).index()
......
})回答 2
Stack Overflow用户
回答已采纳
发布于 2017-05-03 13:08:41
您可以这样做来循环使用free类的td元素。
$('td.free').each(function(i, td) {
var $otherTd = $(td).next().next().next();
// could be more specific by using $td.next('td') instead of just .next()
if ($otherTd.hasClass('free')) {
$(td).addClass('start');
}
});Stack Overflow用户
发布于 2017-05-03 13:25:24
要实现这一点，您可以使用两个循环。一个遍历tr，另一个迭代该行中的td.free元素。对于每个.free元素，您可以通过使用eq()并添加到当前元素的索引来检查第三个td的折叠。试试这个：
$('table tr').each(function() {
var $tr = $(this);
var $td = $tr.find('td');
$td.filter('.free').each(function(i) {
$(this).toggleClass('start', $td.eq(i + 3).hasClass('free'));
});
});td {
width: 20px;
height: 20px;
}
.free { background-color: #CCC; }
.not-free { background-color: #333; }
.start { background-color: #C00; }<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table>
<tr>
<td class="free"></td>
<td class="free"></td>
<td class="free"></td>
<td class="free"></td>
<td class="free"></td>
<td class="not-free"></td>
<td class="not-free"></td>
</tr>
</table>
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/43760873
复制相关文章
相似问题
腾讯云开发者
