1

我正在尝试为每个块的第一个 P 添加一个“忽略”类，并为最后一个 P 添加一个类“样式”。

<div class="tiles_large">
    <span class="spacer">&nbsp;</span>
       <p>image here</p>
    <span class="spacer">&nbsp;</span>
       <h4>headline here</h4>
    <span class="spacer">&nbsp;</span>
       <p>content here</p>
    <span class="spacer">&nbsp;</span>
    </div>

    <div class="tiles_small">
    <span class="spacer">&nbsp;</span>
       <p>image here</p>
    <span class="spacer">&nbsp;</span>
       <h4><div><span>headline here</span></div></h4>
    <span class="spacer">&nbsp;</span>
       <p>content here</p>
    <span class="spacer">&nbsp;</span>
    </div>

这是我的 jquery，但它没有返回预期的结果。

  $(".tiles_large p,.tiles_small p").each(function() {
    $(this).find("p:first").addClass("ignore");
  });

  $(".tiles_large p,.tiles_small p").each(function() {
    $(this).find("p:last").addClass("style");
  });

这是我的小提琴

4

5 回答 5

11

这是你想要的吗？演示。如果是这样，您不需要使用.each函数。

$(".tiles_large,.tiles_small").find("p:first").addClass("ignore").end().find("p:last").addClass("style");
于 2013-03-15T22:24:27.987 回答
1

您正在搜索 and 中的元素p，而它应该只是and 。.tiles_large p.tiles_small p.tiles_large.tiles_small

更新导致这个小提琴

$(".tiles_large,.tiles_small").each(function () {
    $(this).find("p:first").addClass("ignore");
});

$(".tiles_large,.tiles_small").each(function () {
    $(this).find("p:last").addClass("style");
});
于 2013-03-15T22:25:36.780 回答
1

使用.titles_large p:first,.titles_small p:first并删除完整的.find(...)方法。

于 2013-03-15T22:25:57.433 回答
0

这可以这样做：

$(".tiles_large, .tiles_small").each(function() {
    $("p:first", this).addClass("ignore");
    $("p:last", this).addClass("style");
});
于 2013-03-15T22:25:00.493 回答
0

当您运行时.each，您将重复将该功能应用于每个<p>被拾取的功能。认为您正在寻找类似的东西

$(".tiles_large p:first-of-type,.tiles_small p:first-of-type").addClass("ignore");

这基本上是@letiagoalve 发布的内容。我猜first-of-type是在 jQuery 1.9 中添加的。不确定它是否有任何特定的优势......

编辑：找到一个相关线程，更多地讨论性能.find("p").eq(0)以及哪些浏览器可能支持或不支持first-of-type。我自己学到了一些新东西:)

于 2013-03-15T22:33:14.967 回答