Question

示例HTML

<div>
   <div></div>
   <div></div>
   <div></div>
</div>
<div>
   <div></div>
   <div></div>
   <div></div>
</div>
<div></div>
<div></div>

我希望新的HTML看起来像这样

<div>NEW DIV APPENDED HERE</div>
<div>
   <div></div>
   <div></div>
   <div></div>
</div>
<div>
   <div></div>
   <div></div>
   <div></div>
</div>
<div></div>
<div></div>

我在下面尝试了两个，但是新的div被添加到所有div中，而不仅仅是在第一个div之前。

$("div:first-child").before('<div>NEW DIV APPENDED HERE</div>');

$("div:nth-child(1)").before('<div>NEW DIV APPENDED HERE</div>');

Answer 1

first-child选择所有div的第一个子节点，并包含代码中父div的第一个子节点。

要仅选择集合中的第一个div，请使用:first

$("div:first").before('<div>NEW DIV APPENDED HERE</div>');

Answer 2

您应该使用：eq（0），因为它引用结果中的第一个div。

$("div:eq(0)").before("<div>One Above Them All</div>");

请参考这个小提琴： JSFiddle to insert first DIV

我如何使用jQuery在第一个div之前插入多个div而没有id或类？

2 个答案: