JavaScript 字符串 trim() 方法

JavaScript 字符串trim() 方法用于去除字符串两端的空格，并返回一个新的字符串。如果原始字符串在开头或结尾没有空格，则返回相同的字符串。

要仅从字符串的一端去除空格字符，可以使用trimStart() 或trimEnd() 方法，具体取决于要修剪的哪一端。

语法

以下是 JavaScript 字符串trim() 方法的语法：

trim()

参数

它不接受任何参数。

返回值

此方法在去除其开头和结尾的空格后返回一个新字符串。

示例 1

如果原始字符串在两端都没有空格，则返回相同的字符串。

<html>
<head>
<title>JavaScript String trim() Method</title>
</head>
<body>
<script>
   const str = "Tutorials Point";
   document.write("Original string: ", str);
   document.write("<br>New string: ", str.trim());
</script>    
</body>
</html>

输出

上述程序返回“Tutorials Point”。

Original string: Tutorials Point
New string: Tutorials Point

示例 2

在此示例中，我们使用 JavaScript 字符串trim() 方法去除字符串“ Hello World! ”两端的空格。

<html>
<head>
<title>JavaScript String trim() Method</title>
</head>
<body>
<script>
   const str = " Hello World! ";
   document.write("Original string: ", str);
   document.write("<br>Length of original string: ", str.length);
   document.write("<br>New string: ", str.trim());
   document.write("<br>Length of new string: ", str.trim().length);
</script>    
</body>
</html>

输出

执行上述程序后，它将去除两端的空格并返回一个新字符串“Hello World!”。

Original string: Hello World!
Length of original string: 14
New string: Hello World!
Length of new string: 12

示例 3

让我们看看 JavaScript 字符串trim() 方法的实际用法。此方法可用于防止用户在输入字段中使用空用户名和密码登录。

<html>
<head>
<title>JavaScript String trim() Method</title>
</head>
<body>
<input type="text" placeholder="Username" id = 'uname'>
<br><br>
<input type="password" placeholder="Password" id = 'psw'>
<br><br>
<button onclick="Login()">Submit</button>
<span id = 'msg'></span>
<script>
   function Login(){
      let uname = document.getElementById("uname").value;
      let psw = document.getElementById("psw").value;
      let msg = document.getElementById("msg");
      if(uname.trim().length == 0){
         msg.innerHTML = "Username can't be empty...!";
      }
      else if(psw.trim().length == 0){
         msg.innerHTML = "Password can't be empty...!";
      }
      else{
         msg.innerHTML = "Submitted successfully...!";
      }
    }
</script>    
</body>
</html>

输出

程序在屏幕的左上角显示一个 UI。它有两个用于用户名和密码的输入字段，以及一个按钮。如果字段为空并且单击了按钮，则在按钮附近会出现一些错误消息。

打印页面