jQuery si div contiene este texto, reemplace esa parte del texto

79

Como dice el título, quiero reemplazar una parte específica del texto en un div.

La estructura se ve así:

<div class="text_div">
    This div contains some text.
</div>

Y quiero reemplazar solo "contiene" con "hola a todos", por ejemplo. No puedo encontrar una solución para esto.

— Daniel
fuente

¿Qué pasa si el texto fuera 'Este div contiene algún texto que contiene algunas letras' y deseo cambiar el primero que contiene, no el segundo? O simplemente seleccione cualquier palabra y se cambiará por una predefinida.

— stockBoi

145

Puede usar el textmétodo y pasar una función que devuelva el texto modificado, usando el String.prototype.replacemétodo nativo para realizar el reemplazo:

$(".text_div").text(function () {
    return $(this).text().replace("contains", "hello everyone"); 
});

Aquí tienes un ejemplo práctico .

— James Allardice
fuente

2

Puede usar regex / iwantreplacethis / g para todas las ocasiones

— Aiphee

1

Muchas gracias por esto :) una pregunta simple: ¿por qué esto no funciona sin la devolución?

— Aaron Matthews

2

@AaronMatthews Esta respuesta fue hace mucho tiempo, pero creo que sería porque el textmétodo jQuery , cuando se le pasa una función, establece el texto de la selección en el valor de retorno de esa función. Sin el returntexto, el texto sería reemplazado por nada.

— James Allardice

12

Si es posible, puede envolver la (s) palabra (s) que desea reemplazar en una etiqueta de intervalo, así:

<div class="text_div">
    This div <span>contains</span> some text.
</div>

Luego puede cambiar fácilmente su contenido con jQuery:

$('.text_div > span').text('hello everyone');

Si no puede envolverlo en una etiqueta de intervalo, puede usar expresiones regulares.

— grc
fuente

8

var d = $('.text_div');
d.text(d.text().trim().replace(/contains/i, "hello everyone"));

— Fabrizio Calderan
fuente

6

Muy simple, solo use este código, preservará el HTML, mientras elimina solo el texto no envuelto:

jQuery(function($){

    // Replace 'td' with your html tag
    $("td").html(function() { 

    // Replace 'ok' with string you want to change, you can delete 'hello everyone' to remove the text
          return $(this).html().replace("ok", "hello everyone");  

    });
});

Aquí hay un ejemplo completo: https://blog.hfarazm.com/remove-unwrapped-text-jquery/

— hfarazm
fuente

3

Puede utilizar el selector de contenido para buscar elementos que contengan un texto específico

var elem = $('div.text_div:contains("This div contains some text")');
elem.text(elem.text().replace("contains", "Hello everyone"));

— z33m
fuente

esto reemplazará más de una palabra si mi cadena contiene más de una palabra de destino, ¿cuál será entonces?

— Tamaghna Banerjee