Bir öğenin içindeki bir metin dizesini bulun ve bazı yayılma etiketlerini yuvarlak kaydırın

Question

Bir öğede bir metin dizisi bulmak ve bazı yayılma etiketlerini yuvarlak bir şekilde kaydırmak istiyorum. Ör:

<h2>We have cows on our farm</h2> itibaren

<h2>We have <span class='smallcaps'>cows</span> on our farm</h2> için denedim:

$("h2:contains('cow')").each(function() { 
$(this).text().wrap("<span class='smallcaps'></span>"); 
}); 

Ama bu

sadece h2 etiketi içeren bütünü sarar.

Answer 1

$("h2:contains('cow')").html(function(_, html) { 
    return html.replace(/(cow)/g, '<span class="smallcaps">$1</span>'); 
}); 

http://jsfiddle.net/w5ze6/1/ için zaten yer alacağını

Answer 2

Başka bir yaklaşım, anahtar kelimeye göre bölün ve güncelleştirilmiş html'ye katılın.

$("h2:contains('cow')").html(function(_, html) { 
    return html.split('cow').join("<span class='smallcaps'>cow</span>"); 
}); 

Not: Bu test değil ama bu bir değiştirme yapıyor daha kötü performans göstereceğini tahmin ediyorum, ama rakam ı bilgilendirme amaçlı

Answer 3

$("h2:contains('cow')").each(function() { 
    var newText = $(this).html().replace("cow", "<span class='smallcaps'></span>"); 
    $(this).html(newText); 
}); 

Answer 4

Benim durumumda, hedef div içinde bir etiketim var ve bazı metinler bu metni bir linke sarmam gerek.

Bunu nasıl denediniz "Ne denediniz".

var oldText = $(this).text(), 
newText = $(this).html().replace(
    oldText, 
    "<a class='k-link' href='#' class='smallcaps'>" + 
     oldText + 
    "<span class='k-icon k-i-arrow-n'></span></a>" 
); 
$(this).html(newText);