Replace multiple files with just one

Question

How to use JavaScript to detect

<br> <br> <br> 

to become one

 <br> 

?

I tried:

 jQuery('body').html().replace(/(\<br\>\r\n){3, }/g,"\n"); 

but it does not work for me.

Answer 1

Simpler:

var newText = oldText.replace(/(<br\s*\/?>){3,}/gi, '<br>');

This will allow you to use an additional tag terminator (/ ">), as well as spaces to the end of the tag (for example, <br /> or <br > ).

Answer 2

CSS solution

If you want to disable the effect of multiple <br> on a page, you can do this using CSS without using JavaScript:

 br + br { display: none; } 

• Check out the jsFiddle demo .

However, this method is ideal when you work with tags, something like this:

 <div>Text</div><br /><br /><br /> <div>Text</div><br /><br /><br /> <div>Text</div><br /><br /><br /> 

In other cases, for example:

 Hello World<br /> <br /> Hello World<br /> <br /> Hello World<br /> <br /> 

It will fail (as CSS passes text nodes). Use a JavaScript solution instead.

---

Javascript solution

 // It better to wait for document ready instead of window.onload(). window.onload = function () { // Get all `br` tags, defined needed variables var br = document.getElementsByTagName('br'), l = br.length, i = 0, nextelem, elemname, include; // Loop through tags for (i; i < l - 1; i++) { // This flag indentify we should hide the next element or not include = false; // Getting next element nextelem = br[i].nextSibling; // Getting element name elemname = nextelem.nodeName.toLowerCase(); // If element name is `br`, set the flag as true. if (elemname == 'br') { include = true; } // If element name is `#text`, we face text node else if (elemname == '#text') { // If text node is only white space, we must pass it. // This is because of something like this: `<br /> <br />` if (! nextelem.data.replace(/\s+/g, '').length) { nextelem = br[i+1]; include = true; } } // If the element is flagged as true, hide it if (include) { nextelem.style.display = 'none'; } } }; 

• Check out the jsFiddle demo .

Answer 3

What is the point of sending HTML code that is not needed to the client browser and running its JavaScript code for cleaning? It looks like a bad design.

How about fixing all of your static HTML and generating HTML so that these extra elements <br> don't occur in the first place?

If you use JavaScript to modify the document object, do this for dynamic effects that cannot be achieved in any other way.

Answer 4

It would not be such that it was correct:

 $("br~br").remove() 

EDIT: No, this is wrong because its definition of “contiguous” is too weak, as in BoltClock.

Answer 5

Try the following:

 jQuery('body').html( jQuery('body').html().replace(/(?:<br>\s+){3,}/ig,"\n")); ); 

Demo : jsfiddle

Answer 6

try it

 $('body').html($('body').html().replace(/(<br>)+/g,"<br>")); 

It will replace n with the number <br> by one.

Demo

Answer 7

I would go with this:

 $('body').html($('body').html().replace(/<br\W?\\?>(\W?(<br\W?\\?>)+)+/g,"<br>")); 

However, after reading the comments in another post here, I believe that you should try to avoid this if you can fix it at the end.

Answer 8

This solution is only for jQuery + DOM, does not control HTML as a string, works with text nodes, ignores only text nodes with spaces:

 $('br').each(function () { const {nodeName} = this; let node = this; while (node = node.previousSibling) { if (node.nodeType !== Node.TEXT_NODE || node.nodeValue.trim() !== '') { break; }; } if (node && node !== this && node.nodeName === nodeName) { $(node).remove(); } }); 

See: https://jsfiddle.net/kov35jct/