Remove Line Breaks with Javascript

In this tutorial I'll show how to remove line breaks from regular text using some simple javascript code.

If you're looking for online tools that already do this then check out these tools:

- Remove line breaks from text
- Convert text line breaks to html line break <br />

Types of Text Line Breaks

Line breaks in text are generally represented in three ways as either \r\n or as \n or \r. The first type of line break (\r\n) is usually created on a windows computer, the second (\n) on Linux and the third kind of line break (\r) on an Apple computer.

In order to remove line breaks from text we must deal with all three types of line breaks as typically your text could come from any of those sources.

Javascript Code for Line Break Removal

Here's where the javascript magic happens:

//We define the text variable that needs to be cleansed of line breaks.
Var someText = "Here's some text.\n It has some line breaks that will be removed \r using Javascript.\r\n";

//This javascript code removes all 3 types of line breaks
someText = someText.replace(/(\r\n|\n|\r)/gm,"");

Share this page!   

The second piece of code with the javascript replace method removes all three types of line breaks by using this bit of a regular expression: \r\n|\n|\r. This tells it to replace all instance of the \r\n then replace all \n than finally replace all \r. It goes through and removes all types of line breaks from the designated text string.

The "gm" at the end of the regex statement signifies that the replacement should take place over many lines (m) and that it should happen more than once (g).

The "g" in the javascript replace code stands for "greedy" which means the replacement should happen more than once if possible. If for some reason you only wanted the first found occurrence in the string to be replaced then you would not use the "g".

Improving Javascript Code for Line Break Removal

In many real world uses of the javascript code it's probably better to replace the line breaks with a space instead of just removing them entirely.

If for instance we got a column of text from a pdf and we just removed the line breaks entirely we might wind up with words and sentences that run together and are hard to read like this:

Here is a sentence.This sentence runs into itand unfortunately we aremissing some spaces.

Which of course should read like this instead:

Here is a sentence. This sentence runs into it and unfortunately we are missing some spaces.

In order to do this we will update our example by replacing all the types of line breaks with a single space like so:

//This javascript replaces all 3 types of line breaks with a space
someText = someText.replace(/(\r\n|\n|\r)/gm," ");

Removing Extra Spaces from Lines

Now there may be places in the text where double line spaces appear when we just want a single space. To remove all extra white spaces just use this javascript code after the line break removal code:

//Replace all double white spaces with single spaces
someText = someText.replace(/\s+/g," ");

This javascript regex finds multiple whitespaces and replaces them with a single white space.

Share this page!   

Remove Line Breaks Example

You can see the whole thing in action by looking at this simple working example: javascript remove line breaks example.

That's about it for this tutorial. One simple line of javascript to remove the line breaks and replace them with a blank space and a second line of javascript to replace multiple white spaces with single spaces so everything's a little cleaner looking.

Related Tools