jQuery：如何使用特殊类来寻址子项

Question

我想迭代 line 元素。每个 line 元素都有 item 元素作为子元素。因此，首先我迭代 line，然后我想处理某个 item 元素，例如第三个。这是我的代码：

$(".pricetable .righttable .line:not(.blank)").each(function(j) {
    var currentLine = $(".pricetable .righttable .line:not(.blank)").eq(j);
    currentLine.(".item").each(function(k) {
        $(".pricetable .righttable .line .item").eq(i).addClass("active");
    });
});

问题是我不知道如何使用 item 类来处理子元素。

currentLine.(".item").each(function(k)

这是行不通的。

XML 过滤器应用于非 XML 值 ({0:#2=({}), length:1, prevObject:{length:3, prevObject:{0:#1=({}), context:#1# , 长度:1}, 上下文:#1#, 选择器:".pricetable .righttable .line:not(.blank)", 0:#2#, 1:({}), 2:({})},上下文：#1#，选择器：“.pricetable .righttable .line:not(.blank).slice(0,1)”}) 文件:///C:/Users/xxx/lib/pricetable.js 第 112 行

编辑：
哇，我没想到我得到了如此好的和快速的回​​应！我想我会采用这个解决方案：

$(".pricetable .righttable .line:not(.blank)").each(function(j) {
    $(this).children(".item").eq(i).addClass("active");
});

Answer 1

$(".pricetable .righttable .line:not(.blank)").each(function(j) {
    var currentLine = $(".pricetable .righttable .line:not(.blank)").eq(j);
    currentLine.find(".item").each(function(k) {
        $(".pricetable .righttable .line .item").eq(i).addClass("active");
    });
});

http://api.jquery.com/find/

如果它们是 currentLine 的直接子级，则应该能够用 children('.item') 代替 find('.item')。这称为遍历 DOM。访问此页面 (http://api.jquery.com/category/traversing/) 并阅读其中一些函数的描述。如果您经常穿越，记住它们将非常有用:)

Answer 2

$('.pricetable .righttable .line:not(.blank)').find('.item').each(function() {
  // this point to child element - item
  // use $(this).addClass('active');
});

Answer 3

在我回答您的问题之前，略有改进：

var currentLine = $(".pricetable .righttable .line:not(.blank)").eq(j);

可以轻松替换为：

var currentLine = $(this);

---

其次，如果您希望在 $(this) 中找到第三个 .item 元素，请使用 .find()

.find(".item:nth-child(3)");

无需遍历各行。如果您必须迭代这些行，那么只需将 k 与 2 进行比较（JavaScript 从 0 开始计数）即可。

Answer 4

如果您想对每行行的第n个item做某事，它比看起来容易得多：

var index = 3; // the third "item" element 
$(".pricetable .righttable .line:not(.blank) .item:nth-child(" + index + ")")
  .addClass("active");

查看实际效果。

您是否还有其他想做的事情，但上述内容还不够？

Answer 5

$(".pricetable .righttable .line:not(.blank)").each(function() {
  $(this).find('.item:nth-child(2)').addClass('active');
});