セレクタで要素中に特定の値(テキスト)を含む条件を指定したい場合:contains()を用いてフィルターをかけると便利だが、こいつは完全一致ではないため文字列が含まれていればそのまま引っ張ってきてしまう。しかも正規表現が使用できないので完全一致の場合のみ選択したいとなるとちょっとこまる。
ということで調べてみた結果、結局ひっかかった要素をループでまわして評価していくしかなさそうなので下記のような感じで実装した。
下記のような同一のクラスを持つ要素の中で、「testtt」という文字列をもった要素のみテキストを書き換えたいとする。
この場合、普通に:contains()でフィルターをかけると4行目、5行目の要素も選択されてしまう。
<div class="target">test</div> <div class="target">testt</div> <div class="target">testtt</div> <div class="target">testttt</div> <div class="target">testtttt</div>
なので以下のようにする。
<script>
$(function(){
var txt = 'testtt';
var elem = null;
$('.target:contains('+txt+')').each(function(){
if($(this).text() == txt) elem = $(this);
});
elem.text('match!!');
})
</script>
ごり押しで解決。笑