0

私がこの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>

私の問題は、pタグにHTMLを追加していることです。

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

ただし、2番目のpにスパンタグテキスト「Mysecondspan」（またはアプリケーションに応じてそれぞれのスパンテキストを持つ他のpタグ）を追加するだけです。したがって、これは追加後の結果のHTMLです。

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

1つの制限は、元のHTMLソースコードを編集できないため、クラスまたはIDセレクターをそれらに割り当てることができないことです。

特定のスパンテキストで特定のpをターゲットにするようにjQueryセレクターをどのように修正しますか？ヒントをありがとう。

4

4 に答える 4

2

これは、：contains（）セレクターを使用して実現できます。

$("#mydiv span:contains('My second span')")
于 2013-01-07T02:38:19.537 に答える
0

これを試して：

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

編集：

更新された質問で、上記のDaveoの回答によって提案されたセレクターがそれを行う必要があります。ただし、その場合は、次afterの代わりにを使用する必要がありappendます。

$("#mydiv span:contains('My second span')").after('<img src="http://example.com/myimage.png">');
于 2013-01-07T02:34:49.003 に答える
0

これは機能するはずです:($('#mydiv p:nth-child(2)')つまり、pタグが付いた2番目の子を選択しますmydiv）

確かに、ハードコードされたテキストでその要素を選択することはできますが、それは良い考えではないと思います。

于 2013-01-07T02:39:39.303 に答える
0

説明から、このテキストを具体的にしたいとします。:contains(text)セレクターを使用できます。

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リファレンス：http ：//api.jquery.com/contains-selector/

このテキストを含む2番目のスパンのみにフィルタリングする必要があるかどうかは明確ではありません

于 2013-01-07T02:39:54.890 に答える