-1

Want I want to do is scan through a paragraph's innerHTML and find where line breaks are which can be in various forms in between paragraph tags < p >< /p >:

<br>, <br />, or <br></br>

and remove them. BUT, where the line break was, I want to place all text before it into its own paragraph using document.createElement('p'), and all text after it into another new paragraph.

If however there are more than 2 line breaks together with no text in the middle, or just white space, then remove/ignore this and don't bother placing this into its own paragraph.

Here is an example of what I mean. Below is before the alteration:

<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus convallis nisi sem, id gravida felis suscipit at. Sed ipsum felis, posuere ut turpis at, faucibus tempor dui. Nunc gravida sapien id velit vestibulum euismod.
<br />
<br />
Praesent vehicula rhoncus bibendum. Aenean tempus maximus aliquam. Nulla facilisi. Maecenas justo felis, faucibus ut posuere eget, fringilla et arcu. Sed ut pellentesque leo, a tincidunt tellus.</p>

And this is what I want to change it to:

<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus convallis nisi sem, id gravida felis suscipit at. Sed ipsum felis, posuere ut turpis at, faucibus tempor dui. Nunc gravida sapien id velit vestibulum euismod.</p>

<p>Praesent vehicula rhoncus bibendum. Aenean tempus maximus aliquam. Nulla facilisi. Maecenas justo felis, faucibus ut posuere eget, fringilla et arcu. Sed ut pellentesque leo, a tincidunt tellus.</p>

Is this possible to do in Javascript? Thank you for reading!

Mayron
  • 2,146
  • 4
  • 25
  • 51
  • possible duplicate of [Javascript Equivalent to PHP Explode()](http://stackoverflow.com/questions/4514323/javascript-equivalent-to-php-explode) – Szabolcs Páll Jul 28 '15 at 15:23
  • Can you explain why you want to do that on the client, instead of creating the HTML in the right way on the server in the first place? – Tomalak Jul 28 '15 at 15:36
  • Because the user enters text onto the server by filling in a form so I need to format their html in the right way. The server's system does not do this by itself and I do not own it or know how to change it. – Mayron Jul 28 '15 at 15:37
  • I see. Does the user use some kind of WYSIWYG-HTML editor that can be configured or are they entering raw HTML into a textbox? – Tomalak Jul 28 '15 at 15:41
  • Check this link... it might help for a solution http://stackoverflow.com/questions/1144783/replacing-all-occurrences-of-a-string-in-javascript – Guilherme Silva Jul 28 '15 at 15:42
  • @Alon Nope, you should start with a

    , replace any combination of the
    ,
    or
    (presuming the html is formatted correctly, if not you have to match a bit more) with

    , and add a

    at the end.     – zozo Jul 28 '15 at 15:45

1 Answers1

2

For a first simple answer, try this:

s = prompt('Input HTML text example', '<p>...your text here...</p>');
if(!!s) {
  console.log(s.replace(/(<br ?\/?>)+/ig, '</p><p>'));
}

This method assumes that the original text is entered through some WYSIWYG editor, so:

  • we don't need to check if the whole text is wrapped in <p>...</p>
  • there's no matter with something like the </br> you cited

At the opposite if the text is rawly entered as HTML, we might encounter really anything, so it needs a totally different solution, based on a programmatically detailed analysis of the text.

cFreed
  • 4,404
  • 1
  • 23
  • 33