¿Cómo eliminar los espacios en blanco iniciales y finales de una cadena html dada?

177

Tengo la siguiente cadena HTML. ¿Cuál sería el código de muestra en JavaScript para eliminar los espacios en blanco iniciales y finales de esta cadena?

<p>&nbsp;&nbsp;</p>
<div>&nbsp;</div>
Trimming using JavaScript<br />
<br />
<br />
<br />
all leading and trailing white spaces
<p>&nbsp;&nbsp;</p>
<div>&nbsp;</div>

javascript removing-whitespace

— Sunil
fuente

— mira

¿Cuál es tu verdadero problema? ¿Desea eliminar espacios en blanco antes de insertar nodos en el documento?

— Rob W

Quiero eliminar todos los espacios en blanco iniciales, así como todos los espacios en blanco finales. Me gusta mucho el método Trim en C #, excepto que elimina incluso los espacios en blanco.

— Sunil

Entonces, en mi ejemplo, finalmente debería obtener lo siguiente después de recortar: Recortar usando JavaScript <br /> <br /> <br /> <br /> todos los espacios en blanco iniciales y finales

— Sunil

@Sunil No sé si alguna vez resolvió esto, pero podría probar una de estas soluciones: stackoverflow.com/questions/16708158/…

— Chris Baker

244

Consulte el método de cadena trim(): https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/String/Trim

var myString = '  bunch    of <br> string data with<p>trailing</p> and leading space   ';
myString = myString.trim();
// or myString = String.trim(myString);

Editar

Como se señaló en otros comentarios, es posible utilizar el enfoque regex. El trimmétodo es efectivamente solo un alias para una expresión regular:

if(!String.prototype.trim) {  
  String.prototype.trim = function () {  
    return this.replace(/^\s+|\s+$/g,'');  
  };  
}

... esto inyectará el método en el prototipo nativo para aquellos navegadores que todavía están nadando en el extremo poco profundo de la piscina.

— Chris Baker
fuente

3

Preferiría una expresión regular, porque no es compatible con todos los navegadores ( tos, tos, IE <9).

— PeeHaa 05 de

2

El método de recorte no recortará espacios en blanco, sino solo espacios. Entonces no es lo que estoy buscando.

— Sunil

8

No estoy seguro de lo que crees que son los "espacios en blanco", pero el recorte eliminará los espacios en blanco en general (nueva línea, espacio, tabulación, etc.), no solo el carácter de espacio.

— bsa

2

@bsa Llegué a comprender que significa "espacio en blanco" en el sentido visual, como en "áreas visualmente en blanco en los resultados de renderizar el HTML", y luego agregó en un comentario arriba "excepto las nuevas líneas causadas por bretiquetas".

— Chris Baker

2

¿Por qué no hay una marca de verificación en una respuesta con 170 votos a favor? SO me confunde a veces.

— tcoulson

63

var str = "  my awesome string   "
str.trim();

para navegadores antiguos, use regex

str = str.replace(/^[ ]+|[ ]+$/g,'')
//str = "my awesome string"

— Jhankar Mahbub
fuente

2

"[]" es exactamente lo mismo que "". Una agrupación de caracteres de exactamente un carácter es ... bueno ... exactamente un carácter.

— Flimzy

2

@Flimzy: Sí, tendría más sentido escribir [\t\n\ ]o simplemente \sen lugar de [ ]que no tiene sentido.

— erik

11

string.replace(/^\s+|\s+$/g, "");

— Sandeep Manne
fuente

Lea la pregunta,  se utiliza en lugar de un espacio en blanco común. Además de esto, el espacio en blanco está contenido dentro de una etiqueta.

— Rob W

6

Si está trabajando con una cadena multilínea, como un archivo de código:

<html>
    <title>test</title>
    <body>
        <h1>test</h1>
    </body>
</html>

Y desea reemplazar todas las líneas principales, para obtener este resultado:

<html>
<title>test</title>
<body>
<h1>test</h1>
</body>
</html>

Debe agregar la multilinebandera a su expresión regular ^y hacer $coincidir línea por línea:

string.replace(/^\s+|\s+$/gm, '');

Cita relevante de documentos :

El indicador "m" indica que una cadena de entrada multilínea debe tratarse como varias líneas. Por ejemplo, si se usa "m", "^" y "$" cambian de coincidir solo al comienzo o al final de toda la cadena al comienzo o al final de cualquier línea dentro de la cadena.

— Jaime Gómez
fuente

4

Sé que esta es una pregunta muy antigua, pero aún no tiene una respuesta aceptada. Veo que desea eliminar lo siguiente: etiquetas html que están "vacías" y espacios en blanco basados en una cadena html.

Se me ocurrió una solución basada en su comentario para la salida que está buscando:

Trimming using JavaScript<br /><br /><br /><br />all leading and trailing white spaces

var str = "<p>&nbsp;&nbsp;</p><div>&nbsp;</div>Trimming using JavaScript<br /><br /><br /><br />all leading and trailing white spaces<p>&nbsp;&nbsp;</p><div>&nbsp;</div>";
console.log(str.trim().replace(/&nbsp;/g, '').replace(/<[^\/>][^>]*><\/[^>]+>/g, ""));

Expandir fragmento

.trim() elimina los espacios en blanco iniciales y finales

.replace(/ /g, '') elimina  

.replace(/<[^\/>][^>]*><\/[^>]+>/g, "")); elimina etiquetas vacías

— Antonio
fuente

3

var trim = your_string.replace(/^\s+|\s+$/g, '');

— SeñorAmor
fuente

1

¿Eliminará espacios en blanco como <br /> o <p> & nbsp; & nbsp; </p> <div> & nbsp; </div>? Cortar espacios simples no es un problema. Es la eliminación del espacio en blanco lo que busco.

— Sunil

¿eliminará el espacio en blanco

— user2086641

3

01). Si necesita eliminar solo los espacios en blanco iniciales y finales, use esto:

var address = "  No.255 Colombo  "
address.replace(/^[ ]+|[ ]+$/g,'');

esto devolverá la cadena "No.255 Colombo"

02). Si necesita eliminar todo el espacio en blanco, use esto:

var address = "  No.255 Colombo  "
address.replace(/\s/g,"");

esto devolverá la cadena "No.255Colombo"

— Chamila Maddumage
fuente