jQuery：类和 .each()

Question

我正在尝试将类添加到 div (.views-row) 内的元素。我遇到的问题是 .views-row 在页面上重复，这是不可避免的，并且我尝试设置样式的元素最终都具有相同的类，无论它们是否应该。代码可能更好地解释了它：

$(".views-row").each(function(){
        if ($((this)" .field-name-field-warning:contains('High')").length) {
            $((this)" .field-name-field-warning").addClass("fault-high");
            $((this)" .field-name-field-warning .field-label").addClass("disappear");
            $((this)" .field-name-field-warning .field-items").addClass("disappear");
        }
        if ($((this) ".field-name-field-warning:contains('Moderate')").length) {
            $((this) ".field-name-field-warning").addClass("fault-moderate");
            $((this) ".field-name-field-warning .field-label").addClass("disappear");
            $((this) ".field-name-field-warning .field-items").addClass("disappear");
        }
});

我想我在（​​这个）部分遇到了麻烦。有什么想法吗？

谢谢。

Answer 1

如果您想选择当前元素中的任何元素，有两种方法。

使用 $().find()：

$(this).find(".field-name-field-warning")

通过提供上下文（实际上与 find 相同） ：

$(".field-name-field-warning", $(this))

Answer 2

使用 .find() ：

$(this).find("selector");

Answer 3

当 .addClass() 将为您迭代所有元素时，无需在此处使用 .each() 。

您可以从像这样的方法开始：

var containsHigh = $(".views-row .field-name-field-warning:contains('High')")
containsHigh.addClass('fault-high');
containsHigh.find('.field-label, .field-items').addClass('disappear');

var containsModerate = $(".views-row .field-name-field-warning:contains('Moderate')")
containsModerate.addClass('fault-moderate');
containsModerate.find('.field-label, .field-items').addClass('disappear');

然后通过像这样的链接方法变得更奇特：

var warnings = $(".views-row .field-name-field-warning");
warnings.filter(":contains('High')")
    .addClass('fault-high')
    .find('.field-label, .field-items').addClass('disappear');

warnings.filter(":contains('Moderate')")
    .addClass('fault-moderate')
    .find('.field-label, .field-items').addClass('disappear');

Answer 4

看起来您正在尝试使用 this 在元素中查找元素。您应该find 方法和filter 来过滤匹配元素集中的元素。

这是完整的简化代码。

$(".views-row").each(function(){
     var $fieldWarning = $(this).find(".field-name-field-warning");
     if($fieldWarning.length){
        if ($fieldWarning.filter(":contains('High')").length) {
            $fieldWarning.addClass("fault-high");
            $fieldWarning.find(".field-label").addClass("disappear");
            $fieldWarning.find(".field-items").addClass("disappear");
        }
        if ($fieldWarning.filter(":contains('Moderate')").length) {
            $fieldWarning.addClass("fault-moderate");
            $fieldWarning.find(".field-label").addClass("disappear");
            $fieldWarning.find(".field-items").addClass("disappear");
        }
     }
});

参考：.find()、.filter()