jquery - pueden - Encuentre una cadena de texto en un elemento y envuelva algunas etiquetas de trazo a su alrededor

no funcionan los hashtags en instagram 2018

Question

Quiero encontrar una cadena de texto en un elemento y rodearlo con algunas etiquetas de tramo. P.ej:

Desde <h2>We have cows on our farm</h2> hasta <h2>We have <span class=''smallcaps''>cows</span> on our farm</h2>

He intentado:

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

Pero eso solo envuelve la etiqueta que contiene h2.

Answer 1

Aquí hay una variación de la respuesta de @ undefined, que recorre una gran variedad de elementos:

var barnyardArray = [
    ''cow'',
    ''horse'',
    ''chicken'',
    ''hog'',
    ''goat'',
    ''goose'',
    ''duck'',
    ''llama''
];

$.each(barnyardArray, function (index, value) {
    $("p:contains(" + value + ")").html(function (_, html) {
        var regex = new RegExp(value, ''g'');
        return html.replace(regex, ''<span class="smallcaps">'' + value + ''</span>'');
    });
});

Answer 2

En mi caso, tengo una etiqueta dentro del div de destino y algo de texto que necesito para envolver ese texto en un enlace.

Así lo hice después de "¿Qué has intentado".

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);

Answer 3

Otro enfoque, dividido por palabra clave y únete al html actualizado.

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

Nota: No he probado esto, pero estoy suponiendo que esto funcionaría peor que hacer un reemplazo, pero figura que incluiría de todos modos con fines informativos

Answer 4

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

Answer 5

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

http://jsfiddle.net/w5ze6/1/