Función Replace en JavaScript

07/ago/2007 JavaScript , 54 Comentarios
javascript

La función replace de JavaScript nos permite realizar sustituciones dentro de cadenas de texto de grupos de caracteres. La sintaxis de la función replace en JavaScript es la siguiente:

  1. Cadena.replace(CadenaABuscar,NuevaCadena)

Así, podríamos realizar la siguiente sustitución:

  1. var frase = "Son tres mil trescientos treinta y tres con nueve";
  2. frase = frase.replace("tres","dos");
  3. alert(frase);

En este caso, la primera coincidencia se sustituye dentro de la cadena. Es decir, la frase "Son tres mil trescientos treinta y tres con nueve" quedaría como "Son dos mil trescientos treinta y tres con nueve".

Para poder realizar sustituciones más complejas hay que indicar que la función replace en JavaScript admite que el parámetro CadenaABuscar sea una expresión regular.

De esta forma podríamos tener la siguiente sustitución:

  1. var frase = "Son tres mil trescientos treinta y tres con nueve";
  2. frase3 = frase.replace(/[aiou]/gi,'e');
  3. alert(frase3);

Lo que estamos diciendo con la expresión regular es que cualquier carácter del conjunto a, i, o y u, sea sustituido por el carácter 'e'. Nos devolvería "Sen tres mel tresceentes treente y tres cen neeve"

Además, detrás de la expresión regular estamos utilizando un modificador. En este caso gi. Esto significa que la búsqueda es global, es decir, busca todas las coincidencias que puedan existir a lo largo de toda la cadena (modificador g) y que no es sensible a mayúsculas (modificador i).

Por lo tanto, si volvamos a nuestro primer ejemplo y lo que queremos es que se sustituyan todos los 'tres' por 'dos', deberíamos de utilizar el siguiente código:

  1. var frase = "Son tres mil trescientos treinta y tres con nueve";
  2. frase4 = frase.replace(/dos/gi,'nueve');
  3. alert(frase4);

Espero que el ejemplo sea de utilidad...

El anterior contenido de este post se ha desplazado a Implementarnos la función replace de JavaScript Puedes ver la Desambiguación sobre la función replace de JavaScript.

Vídeos sobre JavaScript

Difunde el Conocimiento

Si te ha gustado el artículo o te ha sido de utilidad, no dejes de compartirlo con tus amigos en las redes sociales... Te estaremos muy agradecidos. :-D

54 comentarios en “Función Replace en JavaScript”

Víctor Cuervo

Víctor Cuervo

Muchas gracias por tu comentario @Ed.

Víctor Cuervo

Ed

Muy bueno, simple y efectivo, muchas gracias.

Víctor Cuervo

adan

Reemplazar texto en el text area ejemplo:

un text area en blaco para pegar lo que queramos, lo que se estara pegando siempr etendra la palabra “Hola” y muchas mas lineas de texto, quiero reemplazar “Hola” por “changed”, cada vez que pegue un texto nuevo en el text area

Víctor Cuervo

adan

como reemplazar lo que este en un textarea?
pegar una frase en el text area y cambiarlo.

Víctor Cuervo

Víctor Cuervo

@Miguel Loza, muchas gracias.

Víctor Cuervo

Miguel Loza

Muy buenos manual, me ayudo mucho, gracias. Felicidades

Víctor Cuervo

felipe

hola.. soy nuevo en java y ne cesito q me ayuden con esto susede q tengo q aser un editro de texto en el q cada q de un enter guarde lo ke escrivi en un arreglo o en una variable si puden ayudarme lo agredecere de antemano grax mi correo es yelpi250_250@hotmail.com

Víctor Cuervo

Rizome

(actualización:)
ASÍ:
texto2=texto1.replace(/\[negrita\]/gi,”<b>”);

Víctor Cuervo

Rizome

Los caracteres especiales, se escapan con “\”, y ocurre que “[” y “]” son caracteres “especiales”. Además, sobran las comillas.

Por ello, ha de hacerse así:
texto2=texto1.replace(/\[negrita\]/gi,’‘);

Víctor Cuervo

seba64

y si yo quiero hacer el siguiente reemplazo para Todas las ocurrencias, como dice David

[negrita] => <b>
[/negrita] => </b>

texto=texto.replace(‘[negrita]’,'<b>’); // ERROR- ERROR-
texto=texto.replace(‘[/negrita]’,'</b>); // ERROR- ERROR-

llevo ya un buen rato y no se como hacerlo, alguien que me ayude

Víctor Cuervo

seba64

y si yo quiero hacer el siguiente reemplazo para Todas las ocurrencias, como dice David

[negrita] =>
[/negrita] =>

texto=texto.replace(‘[negrita]’,'<b>’); ERROR- ERROR-
texto=texto.replace(‘[/negrita]’,'</b>); ERROR- ERROR-

llevo ya un buen rato y no se como hacerlo, alguien que me ayude

Víctor Cuervo

seba64

y si yo quiero hacer el siguiente reemplazo para Todas las ocurrencias, como dice David

[negrita] =>
[/negrita] =>

texto=texto.replace(‘[negrita]’,’‘); ERROR- ERROR-
texto=texto.replace(‘[/negrita]’,’
); ERROR- ERROR-

llevo ya un buen rato y no se como hacerlo, alguien que me ayude

Víctor Cuervo

David

“David Martín” anda un poco perdido en su comentario anterior.
Para sustituir TODAS las ocurrencias de ‘str1′, por ‘str2′, en la cadena ‘strTotal’, no hay que usar ninguna función distinta, sino, como bien explica el autor de este blog, hacer como sigue:

‘strTotal’.replace(/str2/gi,’str1′);

Víctor Cuervo

David Martin

function remplazo(strTotal, str1, str2)
{
while(strTotal.indexOf(str1) != -1)
{
strTotal = strTotal.replace(str1, str2);
}
}

sencillo, y para toda la familia.
remplaza de la cadena ‘strTotal’ todoas las concurrencias de ‘str1′ por el valor ‘str2′

Víctor Cuervo

Developer

Recien entro a esta página .. el articulo esta muy bueno me sirvio y tbn la aclaracion de NARE … bueno y alos criticones de este articulo tengan en cuenta que la info es de alguien que comparte conocimientos depende de nosotros captarla … thanks

Víctor Cuervo

sergio

que buena explicacion ojala todos los temas pudieran explicarlos con esta claridad

Víctor Cuervo

gise

funcion para reemplazar caracter especial % por codigo asp

Víctor Cuervo

warley996

Muy bien muchachito muy bien!!

jAHjaHjaH

Víctor Cuervo

sp1d3r

Muchas gracias, funcionó a la perfección

Víctor Cuervo

Josué

Gracias gracias gracias!

Víctor Cuervo

David

Enhorabuena…

Ahora si buscas “replace javascript” en google, tienes un envidiado PRIMER puesto…
Y el contenido, está actualizado, y es fiable.

Un saludo.
y gracias.

Víctor Cuervo

lineadecodigo

@David, @danisvh, tenéis toda la razón del mundo. Era algo que tenía pendiente de arreglar, pero que nunca modificaba.

Ya está corregido y adaptado el contenido al post.

Además he creado una página de Desambiguación sobre la función replace de JavaScript para resolver posibles dudas.

Muchas gracias por vuestro aporte y disculpad las molestias.

Víctor Cuervo

danisvh

Hasta los mismísimos webs de encontrar siempre esta página cuando quiero consultar algo de la función replace y las expresiones regulares. De verdad que se lució el que puso este artículo.

Debería enmarcarse como grandes pufos de Internet. Así después nos encontramos los códigos que nos encontramos por la red.

Además te quedas blanco con la afirmación rotunda del “elemento” que hizo esta porquería.

Víctor Cuervo

David

Alguien debería borrar este hilo, o renombrarlo, o ponerlo como “noindex”, pues es un FAKE que queda en primer lugar en google, cuando se busca “replace javascript”

Ya ha quedo dicho, que el replace, en javascript, es:
texto_reemplazado = texto.replace(/s1/gi, ‘s2′);

*NOTA: usando la misma nomenclatura, que la que usó el desafortunado redactor inicial del artículo.

Víctor Cuervo

Rodro

Creo que eso era mas lo que buscaba por eso la aclaracion. Gracias. no tube tiempo en estos dias. Pero luego comento. Gracias por tu ayuda. Salu2.

Víctor Cuervo

lineadecodigo

@Rodri,

Olvida el anterior comentario del hilo. Y es que te dí la solución con Java en vez de con JavaScript. Para poder hacer el replace con JavaScript con multiples sustituciones tienes que hacerlo de la siguiente forma:

texto = texto.replace(/\(/g,””).replace(/\)/g,””);

Lo que estamos haciendo es buscar un patrón, de ahí la estructura /patrón/

Al querer buscar el paréntesis que es un carácter especial hay que escaparlo anteponiéndolo la barra \.

Y por último le añadimos la g detrás del patrón para que realice una búsqueda de esta ocurrencia por todo el texto.

Espero que te sirva de ayuda.

Víctor Cuervo

Rodri

Hace poquito, casi nada, que empiezo a programar en JavaScript, para mas que una tonteria predefinifda.

Víctor Cuervo

Rodri

Gracias solo preguntaba, porque si no me equivoco los parentesis no los trata como caracteres “comunes”.
Y tenia mi duda. Despues lo pruebo y te comento.

Es que uso varias apis, y demas cosas de terceros, y para que funcione nececito eliminar los parentesis, ya que si lo hago sobre la misma variable, no lo toma. De esta forma funciona de 10. Osea en vez de remplazar el valor devuelto, armo la cadena, y le quito todos los parentesis al final. Comento esto porque en muchas apis, tenes este problema.

Es la forma que enconte yo de solucionarlo y creo que es bastante prolijo, flexible, limpio, fasil, etc, etc, etc.

Víctor Cuervo

lineadecodigo

@Rodri,

Hola, podrías hacerlo en una sola sentencia de la siguiente forma:

String cadena = “((texto))”;
cadena = cadena.replace(“(“,””).replace(“)”,””);
System.out.println(cadena);

Pero tienes que llamar a replace 2 veces.

Espero que te sea de ayuda.

Víctor Cuervo

Rodri

Tengo una cadena, de la cual quiero eliminar los parentesis (son 4 apriciones, 2 de apertura y 2 de cirre)

como es poco lo hago asi:

ruta = ruta.replace(‘\(‘, ”);
ruta = ruta.replace(‘\)’, ”);
ruta = ruta.replace(‘\(‘, ”);
ruta = ruta.replace(‘\)’, ”);

Queria saber si esto se puede hacer llamando a la funcion 1 vez en vez de 4.

Gracias.

Víctor Cuervo

Victor Hugo Saavedra

Miren realice una funcion que remplaza todos los caracteres pero sin expresiones regularas(no le pego mucho a las expresiones regulares).

esta en http://vhspiceros.blogspot.com/2008/12/replace-all-en-javascript.html

de todas formas dejo la funcion aqui.
function replaceAll( text, busca, reemplaza ){
while (text.toString().indexOf(busca) != -1){
text = text.toString().replace(busca,reemplaza);
}
return text;
}

Víctor Cuervo

a

iros a tomar vientos

Víctor Cuervo

Uziel

hola…soy nuevo aqui…estuve viendo el articulo y lo encontre bastante practico…
necesito saber su opinion o sugerencias al respecto de lo siguiente…
Estoy haciendo un codigo en javascript que me capture la url completa y al hacer esto asignarle el valor a una variable y a esta variable hacerle un replace…no se si lo que estoy haciendo esta bien…las sugerencias y comentarios son bienvenidos…

function ReemplazarUrl()
{
var urlCompleta = location.href;

urlCompleta = replace(urlCompleta,”‘”,”””);
urlCompleta = replace(urlCompleta,”select”,””);
urlCompleta = replace(urlCompleta,”drop”,””);
urlCompleta = replace(urlCompleta,”;”,””);
urlCompleta = replace(urlCompleta,”–“,””);
urlCompleta = replace(urlCompleta,”/*”,””);
urlCompleta = replace(urlCompleta,”*/”,””);
urlCompleta = replace(urlCompleta,”insert”,””);
urlCompleta = replace(urlCompleta,”update”,””),
urlCompleta = replace(urlCompleta,”delete”,””);
urlCompleta = replace(urlCompleta,”xp_”,””);

return urlCompleta;
}

con location.href supuestamente deberia capturar la url dentro de la variable urlCompleta.

Víctor Cuervo

Laura Zapata

Muy rápida la solución.

Víctor Cuervo

Pedro

Muy interesante el articulo

http://www.amanra.com

Víctor Cuervo

agu

pollo sos un muerto no sabes nada de programacion, o sos medio pelotudo

Víctor Cuervo

Jota

He observado que al cargar el mensaje las dobles comillas son reemplazadas por otras. Para que el código funcione deben cambiar las dobles comillas del artículo por las dobles comillas ‘rectas’.

La instrucción

foo.replace(”chao”,””)

sólo cambiarà la primera ocurrencia del string ‘chao’.
Si se desea reemplazar todas la ocurrencias del texto es mejor usar la funcion replaceAll().

Víctor Cuervo

Jota

Uy…
intenté subir una HTML entero y me lo destrozó.
Espero que se entienda…

Víctor Cuervo

Jota

Si usas la función replace como tú indicas sólo consegurás que reemplace la primera ocurrencia de ‘chao’.
Nare lo explicó perfectamente en el mensaje núm.3.

Fíjate en la ejecución:

function replaceAll( text, str1, str2 ){
// ATENCION: las comillas dobles deben ser rectas¡
// Use correct quotation marks
var command = “text.replace(/”+str1+”/g,\””+str2+”\”)”;
return eval(command);
}

Texto original

replace

replaceAll

var foo = document.forms.f.txt0.value
document.forms.f.txt1.value = foo.replace(“chao”,””)
document.forms.f.txt2.value = replaceAll( foo, “chao”, “” )

Texto original: “holachao, chao Victor”
replace: “hola, chao Victor”
replaceAll: “hola, Victor”

ATENCIÖN: He observado que en el artículo se han cambiado las comillas dobles por otras. El código Javascript no funcionará a menos que cambien las comillas dobles del artículo por las comillas dobles rectas. Atención con el copiar y pegar…

Víctor Cuervo

Victor Hugo Saavedra

no seria mejor hacer un replace de esta forma

var foo = “holachao”

foo.replace(“chao”,””)

Víctor Cuervo

Jota

Vamos, vamos, caballeros no se sulfuren.
Creo que todos sabemos como hacer un ‘replace’. Lo que buscamos es un fragmento de código que podamos copiar y nos funcione sin más complicaciones.

Ahí va una propuesta:

function replaceAll( text, str1, str2 ){
var command = “text.replace(/”+str1+”/g,\””+str2+”\”)”;
return eval(command);
}

Simple y escueto.
Si queremos ignorar mayúsculas/minúsculal tenemos esta variante…

function replaceAllIgnoreCase( text, str1, str2 ){
var command = “text.replace(/”+str1+”/gi,\””+str2+”\”)”;
return eval(command);
}

texto: donde dije digo digo Diego

var result = replaceAll( txt, “di”, “(DI)” )

donde (DI)je (DI)go (DI)go Diego

var result = replaceAllIgnoreCase( txt, “di”, “(DI)” )

donde (DI)je (DI)go (DI)go (DI)ego

Windows XP/IE7

Siau.

Víctor Cuervo

Radamantis

Vaya mierda de articulo, lo triste es que salga el primero en google.
Normal que luego haya miles de programadores ineptos que cosas sencillisimas las hacen con alguna paranoia indescifrable..

Como bien dice Nare con /caracteraBuscar/g se busca globalmente en toda cadena..
Si no sabes no te pongas a dar lecciones que luego la gente copia todo..

Víctor Cuervo

mauricio

es un truco viejo ese. sirve siempre y cuando se busquen cadenas con case sensitive, y sin expresiones regulares.
POLLO:
tiene ventaja sobre el metodo replace del objeto String, ya que el contenido a buscar es dinamico.

Víctor Cuervo

Pollo

Buenas,

Este artículo debería eliminarse, porque lejos de ayudar despista y afirma cosas que estan implementadas desde la primera versión de Javascript.

La primera frase del artículo es falsa:

“Dentro del lenguaje JavaScript no disponemos de ninguna función que realice un sustitución de cadenas de textos.”

Víctor Cuervo

alex

Nare tiene toda la razon, el si sabe, no como todos ustedes pinches cerrados de la puta mente

Víctor Cuervo

Ruben

function replace(texto,s1,s2){
return texto.split(s1).join(s2);
}
texto = “abcdb”
s1= b
s2 = ;
a(0) = a
a(1) = cd
join
result -> a;cd
si texto termina en s1 no lo hace bien

Víctor Cuervo

jose antonio

Perdón por el mensaje anterior, he visto el código al descargarlo en el correspondiente link, pero lo que busco es que mediante una función javascript introducida en todos los archivos html de mi web, pueda cambiar de golpe una cadena de texto, pero no estilo formulario como en el ejemplo sino un simple texto que figure en la web, como por ejemplo un nombre de empresa en el bajo de cada página.

Víctor Cuervo

jose antonio

Alguíen podría mandarme un ejemplo con una hoja de html, porque soy algo nuevo y no llego a tanta explicación. mi correo antonysanchezmartin@hotmail.com

Víctor Cuervo

José Luis

A mi si me sirvio mucho el articulo, saludos

Víctor Cuervo

Anxo

gracias ivan por aclarar dudas!

Víctor Cuervo

Anxo

Cuanto inutil! ivan por aclarar dudas!

Víctor Cuervo

Nare

Ivan, el /gi en replace le ordena que busque Globalmente e Insensitvo.

/esto/ es para que reemplace la primera aparición de “esto” case sensitive

/esto/g es para que reemplace la primera aparición de “esto” globalmente

/esto/i es para que reemplace la primera aparición de “esto” case INsensitive

/esto/gi es para que reemplace la primera aparición de “esto” globalmente y case INsensitive

Víctor Cuervo

Ivan

Pollo. El replace de javascript solo reemplaza la primer coincidencia, las demas las deja como estaba.
Me parece buenisima esta solucion
saludos

Víctor Cuervo

Pollo

Buenas,

Interesante el artículo, aunque comentar que javascript si provee de un método para hacer reemplazo de cadenas.

mivariable = mireemplazo.replace(/esto/gi, “poresto”);

Saludos,

¿Algo que nos quieras comentar?

Déjanos tu comentario, no te preocupes que tu email no será publicado

*


*