I came across this thread because I was searching for a solution to eliminate gaps around divs caused by white space in HTML source, or line feeds in my case.
Before I realized that white space could cause these gaps, I was going nuts trying to get rid of them. I want to keep my HTML source formatted for readability, so compressing the code is not a good solution for me. Even if I handled it this way, it doesn't fix divs that are generated by Google and other vendors.
I started by creating the following function and calling it in body onload.
function Compress_Html() {
//Remove whitespace between html tags to prevent gaps between divs.
document.body.innerHTML = document.body.innerHTML.replace( /(^|>)\s+|\s+(?=<|$)/g, "$1" );
}
This seemed to work perfectly, but unfortunately, it breaks the Google search box I have in my footer.
After trying many variations of the regex pattern without success, I found this regex tester at http://www.regexpal.com/. I far as I can tell, the following pattern does what I need.
( /(^|>)[ \n\t]+/g, ">" )
That said, the function was still breaking the search box. So I ended up moving it into a jQuery document ready function. Now it's working and does not break the search box.
<script src="https://code.jquery.com/jquery-1.9.1.min.js"></script>
<script>
$( document ).ready(function() {
document.body.innerHTML = document.body.innerHTML.replace( /(^|>)[ \n\t]+/g, ">" );
});
</script>
\n
, it's\s
.