In this tutorial we will see how to Remove White Spaces from Start and End of String using JQuery. The JQuery $.trim() function is used for this purpose.
Table of Contents
HTML Code
HTML Code is given below, This code contains our main string written inside the span tag. This string is trimmed and then displayed inside another span tag with the help of jQuery code.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Remove White Spaces from Start and End of String using JQuery</title>
<script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
</head>
<body>
<h1>Main String:</h1>
<span id='main'> This is HowToCodeSchool.com </span>
<h1>Trimmed String:</h1>
<span id='trimmed'></span>
<br><br>
<button id='btn'>Trim Your String</button>
</body>
</html>
JQuery Code
JQuery Code is given below, In this code the JQuery trim() method is used. First when button is clicked, the value of string is read using .text() method, then the string is trimmed and displayed using .html method.
<script>
$('#btn').click(function(){
var str = $("#main").text();
var str1 = $.trim(str);
$("#trimmed").html(str1);
})
</script>
Demo
JQuery .trim() method
The JQuery .trim() method is used to remove the white spaces from the start and the end of the string. The $.trim() function removes all newlines, spaces and tabs from the start and the end of the string.
The trim function doesn't remove the whitespaces present in the middle of the string.
Video Tutorial
Watch video tutorial on how to Remove White Spaces from Start and End of String using JQuery.