Reemplazar texto en la página HTML con jQuery

¿Cómo reemplazo cualquier cadena en jQuery?Reemplazar texto en la página HTML con jQuery

Digamos que tengo una cadena "-9o0-9909" y quiero reemplazarla con otra cadena.

2011-02-03 Developer

posible duplicado de [Cómo reemplazar un bloque de HTML con otro bloque de HTML usando jQuery] (http://stackoverflow.com/questions/2734174/how-to-replace-a-block-of-html-with -Otro-bloque-de-html-using-jquery) antes de hacer una pregunta, es bueno verificar las sugerencias automáticas que hace el sistema al ingresar un título de pregunta –

¿Puede explicar por qué cree que jquery es el camino a seguir? - las respuestas hasta ahora pueden estar desviadas. – Xhalent

Puedo cambiar el texto en la página C#, javascript y base de datos y páginas html, pero estaba pensando si es posible lograr eso usando jquery después de cargar la página. Estoy intentando ahorrar algo y aprender algo nuevo :) – Developer

podría utilizar el siguiente para reemplazar la primera ocurrencia de una palabra dentro del cuerpo de la página:

var replaced = $("body").html().replace('-9o0-9909','The new string'); 
$("body").html(replaced);

Si desea reemplazar todas las apariciones de una palabra, necesita usar regex y declararlo global /g:

var replaced = $("body").html().replace(/-1o9-2202/g,'The ALL new string'); 
$("body").html(replaced);

Si quieres un chiste:

$("body").html($("body").html().replace(/12345-6789/g,'<b>abcde-fghi</b>'));

Básicamente estás tomando todo el HTML dentro de los <body> etiquetas de la página en una variable de cadena, utilizando replace() de encontrar y cambiar la primera aparición de los encontrados cuerda con una nueva cuerda. O si desea buscar y reemplazar todas las apariciones de la secuencia, introduzca un poco de expresiones regulares en la mezcla.

See a demo here - mira el HTML arriba a la izquierda para ver el texto original, el jQuery a continuación y el resultado a la derecha de abajo.

Fuente

2011-02-04 00:33:07 Scoobler

Código que funcionó bien, Gracias scoobler. jQuery (función ($) { var replace = $ ("cuerpo"). html(). replace (/ 12212-522-1212/ig, '2121-2121-0000'); $ ("cuerpo"). html (reemplazado); }); – Developer

No creo que esto sea bastante efectivo ... ¡deberíamos buscar una mejor solución chicos! –

Esta solución no es buena, porque cambia el DOM de HTML. está reemplazando el HTML completo, por lo que todo en la página se volvió a insertar, está bien para el sitio simple, pero si tiene mucho javascript se romperán, ya que el DOM se cambia. –

... Tengo una cadena "-9o0-9909" y quiero reemplazarla con otra cuerda.

El código siguiente lo hará.

var str = '-9o0-9909'; 

str = 'new string';

Bromas aparte, la sustitución de los nodos de texto no es trivial con JavaScript.

He escrito una publicación sobre esto: Replacing text with JavaScript.

Fuente

2011-02-03 12:50:59 alex

No sé por qué no se aceptó su respuesta. –

El código en su enlace maneja * casi * todos los casos. Para mí, estaba borking en '
' en el conjunto ('child' es' null'), y también inexplicablemente se bloqueaba en 'splitText' ahora y nuevamente con" offset de división excede la longitud del nodo de texto ". Además, "lienzo" está mal escrito como "cavas". Aún así, +1 sin embargo. – bishop

@bishop Gracias, definitivamente necesito actualizar esa publicación. – alex

$("#elementID").html("another string");

http://api.jquery.com/html/

Fuente

2011-02-03 12:51:22

no son siempre la misma identificación, podría ser un nombre de clase o nombre de identificación diferente. Si tuviera solo 1 nombre de clase o nombre de identificación, no sería difícil, pero es aleatorio la mayor parte del tiempo. – Developer

¿Desea buscar una cadena en todo el árbol HTML y reemplazarla? – vicvicvic

sí más como eso estoy pensando – Developer

var replaced = $("body").html().replace(/-1o9-2202/g,'The ALL new string'); 
$("body").html(replaced);

para la variable:

var replaced = $("body").html().replace(new RegExp("-1o9-2202", "igm"),'The ALL new string'); 
$("body").html(replaced);

Fuente

2012-12-11 12:15:21 raoofabdul

¡Finalmente el reemplazo multilínea codicioso! ¡Me salvaste el culo hoy! –

Salida Padolsey's article on DOM find and replace, así como the library to implement the described algorithm.

En este ejemplos de uso, puedo reemplazar todo el texto dentro de un <div id="content"> que se parece a un número de teléfono de Estados Unidos con un enlace tel: esquema:

findAndReplaceDOMText(document.getElementById('content'), { 
    find:/\b(\d\d\d-\d\d\d-\d\d\d\d)\b/g, 
    replace:function (portion) { 
     var a = document.createElement('a'); 
     a.className = 'telephone'; 
     a.href = 'tel:' + portion.text.replace(/\D/g, ''); 
     a.textContent = portion.text; 
     return a; 
    } 
});

Fuente

2014-09-20 19:14:27 bishop

parece ser la solución más completa hasta ahora, ¡gracias! – leitasat

El html sustituir idea es buena, pero si se hace en el documento. cuerpo, la página parpadeará y los anuncios desaparecerán.

Mi solución: $("*:contains('purrfect')").each(function() { var replaced = $(this).html().replace(/purrfect/g, "purrfect"); $(this).html(replaced); });

Fuente

2014-10-31 21:24:03

Al igual que otros mencionados en este hilo, la sustitución de todo el cuerpo HTML es una mala idea, ya que vuelve a insertar todo el DOM y potencialmente puede romper cualquier otra javascript que actuaba en esos elementos.

En cambio, reemplazar sólo el texto en su página y no los propios elementos DOM utilizando jQuery filter:

$('body :not(script)').contents().filter(function() { 
    return this.nodeType === 3; 
    }).replaceWith(function() { 
     return this.nodeValue.replace('-9o0-9909','The new string'); 
    });

this.nodeType es el tipo de nodo que estamos buscando para reemplazar el contenido de. nodeType 3 es texto. See the full list here.

Fuente

2016-07-07 16:53:35 dmcb

Reemplazar texto en la página HTML con jQuery

Respuesta

Cuestiones relacionadas