Jquery / CSS - addClass到第一个：具有指定类的多个div的p

Question

我正在使用（尝试使用）jQuery将类添加到每个 div的第一段，类为“.djBio”我的问题是它只将类添加到第一个div.djBio，而不是所有 div与该类。这是代码。我也使用花哨的字母jquery插件将首字下沉添加到第一段（这也只适用于第一个div.djBio，而不是全部）

jQuery(function( $ ){
    $('.servicesContent p:first, .about-usContent p:first, .djBio p:first').fancyletter().addClass('firstP');
});

非常感谢你的帮助！

Answer 1

你偶然发现了每个人在某些时候偶然发现的事情：:first并不意味着你（起初）认为它意味着什么。 :first 只会返回（最多）一个元素。我能想到解决问题的最好方法是使用each()：

$(function() {
  $(".servicesContent, .about-usContent, .djBio").each(function() {
    $(this).find("p:first").addClass("...");
  });
});

Answer 2

您可以重写这样的代码，将类添加到所有第一个p标记中：

$('.servicesContent, .about-usContent, .djBio').each(function() {
    $(this).find('p:first').fancyletter().addClass('firstP');
});

您的代码的问题是它只找到具有给定类的元素中的第一个p标记实例。

Answer 3

正如您所发现的，:first selector匹配您应用它的选择器的第一个元素，并且只返回（最多）一个元素。

您需要使用:first-child selector，它将匹配作为其父级的第一个子元素的任何元素。 （请注意，如果在第一个p之前存在不同的元素，则它仍然无效）