Automatically Convert Spaces To Non-breaking Spaces After Numbers With Js
The title says it all, how is it possible to convert all the spaces to non-breaking spaces, following every number of the html, using Javascript? [edit] I've tried that (source):
Solution 1:
The
is tricky, the easiest thing to do is copy and paste it from a site like this one. Details are commented in Snippet.
SNIPPET 1
/* capture: ( any number: \d) that has a
|| whitespace: \s following it.
|| global: g, allows the search to continue
|| after the first target is found.
|| unicode: u, will accept unicode in
|| various ways, this snippet is using
|| copy and paste of
*/var rgx = /(\d)\s/gu;
/* Using string literal by using the backtick: `
|| instead of quotes. This allows us to use
|| multi-line strings
*/var str = `abcd
efghi 123 456
789 10a11 b12c 01`;
/* .replace the regex matches with the original
|| content: $1 followed by a (or \u00a0)
|| Although it's invisible the space following
|| $1 is . evident in results
*/var res = str.replace(rgx, '$1 ');
/* Note the string has less breaks only one
|| remains since it is after a letter
*/console.log(res);
SNIPPET 2
// Get the innerHTML of parent elementvar main = document.querySelector('main').innerHTML;
// Convert it into a stringvar str = main.toString();
var rgx = /(\d)\s/gu;
var res = str.replace(rgx, '$1 ');
console.log(res);
var M = document.querySelector('main');
M.insertAdjacentHTML('afterbegin', res);
<main><p>the number pi 3.14
goes on forever, because its running from chuck norris. </p><p>The leading causes of death in the United States are: 1 Heart Disease 2
Chuck Norris 3
Cancer. Chuck Norris drives an ice cream truck covered in human skulls, Chuck Norris is so fast, he can run around the world and punch himself in the back of the head. Crop circles are Chuck Norris' way of telling the world that sometimes corn needs to lie down Crop circles are Chuck Norris' way of telling the world that sometimes corn needs to lie down, If you spell Chuck Norris in Scrabble, you win. Forever, Chuck Norris told his iPhone 2g it was a iPhone 4
He can now multi task and use face time, Chuck Norris counted to infinity - 2
times, Chuck Norris is the only man to ever defeat a brick wall in a game of tennis. Chuck Norris invented Kentucky Fried Chicken's famous secret recipe, with 11
herbs and spices. But nobody ever mentions the 1
of 12
ingredients: Fear. Chuck Norris doesn't wear a watch. HE decides what time it is Chuck Norris uses pepper spray to spice up his steaks. </p><p>Chuck Norris drives an ice cream truck covered in human skulls. Chuck Norris drives an ice cream truck covered in human skulls When the Boogeyman goes to sleep every night, he checks his closet for Chuck Norris. The chief export of Chuck Norris is Pain There is no theory of evolution. Just a list of animals Chuck Norris allows to live, Chuck Norris doesn't wear a watch. HE decides what time it is, Chuck Norris can slam a revolving door. </p><p>Chuck Norris drives an ice cream truck covered in human skulls, Chuck Norris doesn't wear a watch. HE decides what time it is. Chuck Norris is 10
feet tall, weighs two-tons, breathes fire, and could eat a hammer and take a shotgun blast standing. Chuck Norris doesn't churn butter. He roundhouse kicks the cows and the butter comes straight out, Fool me once, shame on you. Fool Chuck Norris 1
time and he will roundhouse you in the face Chuck Norris is my Homeboy, Chuck Norris doesn't wear a watch. HE decides what time it is, Chuck Norris doesn't wash his clothes, he disembowels them, Chuck Norris 1
time roundhouse kicked someone so hard that his foot broke the speed of light, went back in time, and killed Amelia Earhart while she was flying
over the Pacific Ocean Fool me 1
time, shame on you. Fool Chuck Norris once and he will roundhouse you in the face. Fool me 1
time, shame on you. Fool Chuck Norris 1
time and he will roundhouse you in the face. Chuck Norris is so fast, he can run
around the world and punch himself in the back of the head. </p></main>
var main = document.querySelector('main');
main.normalize();
/* If we want the whole page to be normalized:
|| document.normalize();
*/
<main><p>the number pi 3.14
goes on forever, because its running from chuck norris. </p><p>The leading causes of death in the United States are: 1 Heart Disease 2
Chuck Norris 3
Cancer. Chuck Norris drives an ice cream truck covered in human skulls, Chuck Norris is so fast, he can run around the world and punch himself in the back of the head. Crop circles are Chuck Norris' way of telling the world that sometimes corn needs to lie down Crop circles are Chuck Norris' way of telling the world that sometimes corn needs to lie down, If you spell Chuck Norris in Scrabble, you win. Forever, Chuck Norris told his iPhone 2g it was a iPhone 4
He can now multi task and use face time, Chuck Norris counted to infinity - 2
times, Chuck Norris is the only man to ever defeat a brick wall in a game of tennis. Chuck Norris invented Kentucky Fried Chicken's famous secret recipe, with 11
herbs and spices. But nobody ever mentions the 1
of 12
ingredients: Fear. Chuck Norris doesn't wear a watch. HE decides what time it is Chuck Norris uses pepper spray to spice up his steaks. </p><p>Chuck Norris drives an ice cream truck covered in human skulls. Chuck Norris drives an ice cream truck covered in human skulls When the Boogeyman goes to sleep every night, he checks his closet for Chuck Norris. The chief export of Chuck Norris is Pain There is no theory of evolution. Just a list of animals Chuck Norris allows to live, Chuck Norris doesn't wear a watch. HE decides what time it is, Chuck Norris can slam a revolving door. </p><p>Chuck Norris drives an ice cream truck covered in human skulls, Chuck Norris doesn't wear a watch. HE decides what time it is. Chuck Norris is 10
feet tall, weighs two-tons, breathes fire, and could eat a hammer and take a shotgun blast standing. Chuck Norris doesn't churn butter. He roundhouse kicks the cows and the butter comes straight out, Fool me once, shame on you. Fool Chuck Norris 1
time and he will roundhouse you in the face Chuck Norris is my Homeboy, Chuck Norris doesn't wear a watch. HE decides what time it is, Chuck Norris doesn't wash his clothes, he disembowels them, Chuck Norris 1
time roundhouse kicked someone so hard that his foot broke the speed of light, went back in time, and killed Amelia Earhart while she was flying
over the Pacific Ocean Fool me 1
time, shame on you. Fool Chuck Norris once and he will roundhouse you in the face. Fool me 1
time, shame on you. Fool Chuck Norris 1
time and he will roundhouse you in the face. Chuck Norris is so fast, he can run
around the world and punch himself in the back of the head. </p></main>
SNIPPET 3
Solution 2:
Should be a simple replace with a regular expression:
var input = '10 USD';
var output = input.replace(/(\d) /g, '$1 ');
console.log(output); // "10 USD"
Solution 3:
One solution is:
var tree = document.createTreeWalker(document.body, NodeFilter.SHOW_TEXT);
while (tree.nextNode()) {
var textNode = tree.currentNode;
textNode.nodeValue = textNode.nodeValue.replace(/(\d)\s/gu, '$1\xa0');
}
<h1>Lorem 4 ipsum, lorem 5 ipsum…</h1><p>That text will not let any number alone at the end of the lines. I've got 99 problems but non-breaking spaces after numbers aren't one anymore! I've got 99 problems but non-breaking spaces after numbers aren't one anymore! I've got 99 problems but non-breaking spaces after numbers aren't one anymore!</p>
(Will probably not work with IE7).
→ All credits go to @zer00ne for the inputs and the regex, and @c.P.u1 (source)!
Post a Comment for "Automatically Convert Spaces To Non-breaking Spaces After Numbers With Js"