javascript - linea - ¿Cómo sustituyo todos los saltos de línea en una cadena con etiquetas<br/>?

salto de linea html/n

Question

¿Cómo puedo leer el salto de línea de un valor con Javascript y reemplazar todos los saltos de línea con etiquetas br ?

Ejemplo:

Una variable pasada de PHP como sigue:

  "This is man.

     Man like dog.
     Man like to drink.

     Man is the king."

Me gustaría que mi resultado se vea algo así después de que Javascript lo convierta:

  "This is man<br /><br />Man like dog.<br />Man like to drink.<br /><br />Man is the king."

Answer 1

Esto convertirá todas las devoluciones en HTML

str = str.replace(/(?:/r/n|/r|/n)/g, ''<br>'');

Answer 2

Esto funciona para la entrada proveniente de un área de texto.

str.replace(new RegExp(''/r?/n'',''g''), ''<br />'');

Answer 3

Esto me funcionó cuando el valor provenía de un TextBox:

string.replace(//n|/r/n|/r/g, ''<br/>'');

Answer 4

Independientemente del sistema:

my_multiline_text.replace(/$/mg,''<br>'');

Answer 5

Para aquellos de ustedes que solo quieren permitir max. 2 <br> seguidas, puedes usar esto:

let text = text.replace(/(/r?/n){2,}/g, ''<br><br>'');
text = text.replace(/(/r?/n)/g, ''<br>'');

Primera línea: busque /n O /r/n donde al menos 2 de ellos están en una fila, por ejemplo, /n/n/n/n . Luego reemplazarlo con 2 br

Segunda línea: busque todos los /r/n o /n solteros y sustitúyalos por <br>

Answer 6

Si envía la variable desde PHP, puede obtenerla con esto antes de enviar:

$string=nl2br($string);

Answer 7

Si la respuesta aceptada no funciona bien para usted, entonces puede intentarlo.

str.replace(new RegExp(''/n'',''g''), ''<br />'')

Funcionó para mí.

Answer 8

Si su preocupación es solo mostrar los saltos de línea, puede hacer esto con CSS.

HTML

<div class="white-space-pre">Some test
with linebreaks</div>

CSS

.white-space-pre {
    white-space: pre-wrap;
}

jsfiddle https://jsfiddle.net/yk1angkz/125/

Nota : Preste atención al formato y sangría del código, ya que white-space: pre-wrap mostrarán todos los espacios en blanco (excepto la última nueva línea después del texto, ver violín).

Answer 9

Sin regex:

str = str.split("/n").join("<br />");

Answer 10

También es importante codificar el resto del texto para protegerlo de posibles ataques de inyección de scripts.

function insertTextWithLineBreaks(text, targetElement) {
    var textWithNormalizedLineBreaks = text.replace(''/r/n'', ''/n'');
    var textParts = textWithNormalizedLineBreaks.split(''/n'');

    for (var i = 0; i < textParts.length; i++) {
        targetElement.appendChild(document.createTextNode(textParts[i]));
        if (i < textParts.length - 1) {
            targetElement.appendChild(document.createElement(''br''));
        }
    }
}