javascript - 使用 jQuery 仅定位一个元素

Question

我的代码有这个小问题，我想 Stack Overflow 的人可能知道如何解决这个问题。

场景是这样的:

我需要将 strong 内的 p 附加到另一个元素中，该元素将成为后置标题。我已经能够创建解决方案，但我遇到了问题。照片标题复制到其他同名元素中，我不想发生这种情况。所以帖子可能有照片标题，但并非总是如此，但它仍然需要工作。

HTML

<div class="post">
  <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut ornare erat sit amet nulla  faucibus pharetra. Donec in mauris lorem. Pellentesque egestas aliquet lobortis. Praesent molestie.</p>
</div>
<div class="post">
  <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut ornare erat sit amet nulla faucibus pharetra. Donec in mauris lorem. Pellentesque egestas aliquet lobortis. Praesent molestie.</p>
</div>
<div class="post">
  <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut ornare erat sit amet nulla faucibus pharetra. Donec in mauris lorem. Pellentesque egestas aliquet lobortis. Praesent molestie.</p>
  <p><strong>This is a caption.</strong></p>
</div>

JS

var $caption = $(".post strong:first-child").text();
var $removable = $(".post strong:first-child");

$(".post strong:first-child").parent().remove();
$removable.remove();

$(".post").append("<p class='post-caption'>" + $caption + "</p>");

这是 Codepen 片段:

http://codepen.io/aleksitappura/pen/auvrE

我会感谢你的所有帮助。

Answer 1

$(".post strong:first-child").parent().remove();表示每个.post<中的第一个strong/.

如果您只想要第一个 .post，您可以执行 $('.post').first().find('strong'); 或 $('.post:first-child strong');