In this tutorial we will learn how to Remove all spaces in String with jQuery. We can use replace() method with RegExp g Modifier to look for all spaces and then they can be removed.
Table of Contents
replace() method
replace() method searches for the defined value or regular expression and then replaces it with other defined value.
replace() method doesn't change the original string.
RegExp g Modifier
RegExp g Modifier is used for a global search which means it looks for all matches instead of first or last match.
This will find all spaces present in a string, then they are removed.
HTML Code
HTML Code is given below, in this code input tag is used to take string as an input and new string with all spaces removed are displayed using the paragraph tag.
Button tag is used to execute the code on click event.
<!DOCTYPE html>
<html>
<head>
<title>jQuery Remove all Spaces in String</title>
<script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
</head>
<body>
<input id="string" type="text">
<p id="output"></p>
<button id="btn">Remove Spaces</button>
<script src="script.js"></script>
</body>
</html>
JQuery Code
JQuery Code is given below, jQuery click() method is used to tie the execution of code with click event of button tag.
string variable will store the string value. Then replace(/ /g , "") is used to remove or delete all spaces.
text() method is used to display the result.
<script>
$(document).ready(function(){
$('#btn').click(function(){
var string = $('#string').val();
var newString = string.replace(/ /g , "");
$('#output').text(newString);
});
});
</script>
In second example all spaces are remove from a predefined string.
<script>
var string = "How To Code School";
var newString = string.replace(/ /g , "");
alert(newString);
</script>
Output
HowToCodeSchool
Note: This method removes spaces from everywhere in the string, from start, end and in the middle.
Demo
Video Tutorial
Watch video tutorial on How To Remove all Spaces in String with jQuery.