JavaScriptのtrimメソッドで、文字列の先頭と末尾の半角空白を取り除くサンプルです。
目次
| サンプル | 先頭と末尾の空白を取り除く(trim) |
| 文字列の中にある半角空白も取り除く(replace) | |
| jQuery | jQueryで先頭と末尾の空白を取り除く(trim) |
先頭と末尾の空白を取り除く(trim)
| str.trim() |
- 文字列の先頭と末尾の半角空白を取り除きます。
→全角空白も取り除きます。 - 空白が複数の場合、複数の空白を取り除きます。
- 先頭と末尾以外にある空白は取り除きません。
文字列の先頭と末尾の半角空白を取り除くサンプルです。
コード中のコメントにある△は半角空白で□は全角を表しています。
<script>
// 半角空白あり(△あいう +1△△)
const str1 = " あいう +1 ";
const str2 = str1.trim();
console.log(str2); // あいう +1
console.log(str2.length); // 6
// 全角空白あり(□あいう△+1□)
const str3 = " あいう +1 ";
const str4 = str3.trim();
console.log(str4); // あいう +1
console.log(str4.length); // 6
</script>
4行目は、trimメソッドで先頭の半角空白と末尾の連続した半角空白を取り除いています。
文字列の中にある空白は削除しません。
11行目は、先頭と末尾の全角空白を取り除きます。
文字列の中にある半角空白も取り除く(replace)
| 文字列.replace (文字or 正規表現 , 置換後の文字or関数); |
- 指定した1文字を別の1文字に置換します。空白も置き換えできます。
文字列の中にある半角空白も取り除くサンプルです。
<script>
// 半角空白あり(△あ△い△う△ +1△△)
const str1 = " あ い う +1 ";
const str2 = str1.replace(/\s/g, "");
console.log(str2); // あいう+1
console.log(str2.length); // 5
</script>
文字列の中にある半角空白を取り除くには、
1つ目の引数を半角空白(正規表現)にして、2つ目の引数を空文字にします。
\sは、半角空白を表します。
/gは正規表現のオプションでマッチしたものを全て返します。
jQueryで先頭と末尾の空白を取り除く(trim)
jQueryで先頭と末尾の空白を取り除くサンプルです。
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script>
// 半角空白あり(△あいう +1△△)
const str1 = " あいう +1 ";
const str2 = $.trim(str1);
console.log(str2); // あいう +1
console.log(str2.length); // 6
// 全角空白あり(□あいう△+1□)
const str3 = " あいう +1 ";
const str4 = $.trim(str3);
console.log(str4); // あいう +1
console.log(str4.length); // 6
</script>
5行目は、jQueryのtrimで先頭の半角空白と末尾の連続した半角空白を取り除いています。
12行目は、先頭と末尾の全角空白を取り除いています。
関連の記事