jQuery选择器，取决于span标记的值

假设我有这个HTML：

<div id="mydiv">
<p>
<span>My first span</span>
</p>
<p>
<span>My second span</span>
</p>
<p>
<span>My third span</span>
</p>

我的问题是，我正在将HTML附加到p标记：

$('#mydiv p').append('<img src="http://example.com/myimage.png">');

但是我只想在第二个p后面附加span标记文本My second span，或者根据我的应用程序，在任何其他p标记后面附加各自的span文本。因此，这是添加以下内容后生成的HTML：

<p>
<span>My second span</span><img src="http://example.com/myimage.png">
</p>

---

一个限制是，我无法编辑原始HTML源代码，因此无法为它们分配类或ID选择器

我将如何修改jQuery选择器以针对具有特定span文本的特定p？谢谢你的提示。

试试这个：

$('#mydiv p:eq(1)').append('<img src="http://example.com/myimage.png">');

---

您可以使用：contains选择器实现这一点

$("#mydiv span:contains('My second span')")

这应该有效：$'mydiv p:nth-child2'，即选择第二个带有mydiv的p标记的子级

---

当然，您可以通过硬编码文本选择该元素，但我认为这不是一个好主意。

从解释中假设您希望该文本特定。可以使用：containstext选择器

var txt="My second span" ;
/* selector finds the span, parent() moves back up to "p" tag*/
$('#mydiv p span:contains('+txt+')').parent().append('<img ...>');

API参考：

---

不清楚是否必须只将其过滤到包含此文本的第二个span

谢谢，是否可以包含span文本值以获得更准确的选择器？我不建议您为p元素分配一个类，该元素将包含附加的html。一个限制是我无法编辑原始html源代码。谢谢你的提示。

var txt="My second span" ;
/* selector finds the span, parent() moves back up to "p" tag*/
$('#mydiv p span:contains('+txt+')').parent().append('<img ...>');