文字列を改行や区切り文字で分割する - Splitによる文字列分割 - JavaScript

JavaScriptで文字列を区切り文字で分割するコードを紹介します。

概要

文字列を区切り文字で分割するにはSplitメソッドを利用します。Splitメソッドの引数に区切り文字を与えて呼び出すと、分割された文字列配列が戻り値として返ります。

プログラム

Splitメソッドを利用したプログラム例です。

コード

下記のコードを記述します。

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title></title>
	<meta charset="utf-8" />
  <script type="text/javascript">
    function proc() {
      var input = document.getElementById("Text1").value;
      var separator = document.getElementById("Text2").value;
      var items = input.split(separator);

      var outControl = document.getElementById("Output1");
      for (var i = 0; i < items.length; i++) {
        outControl.value += items[i] + "\r\n";
      }
    }
  </script>
</head>
<body>
  入力<br/>
  <input id="Text1" type="text" size="80" /><br/>
  区切り文字<br />
  <input id="Text2" type="text" size="80" /><br />
  <input id="Button1" type="button" value="処理" onclick="proc();"/><br />
  結果<br />
  <textarea id="Output1" cols="50" rows="10"></textarea><br />

</body>
</html>

解説

[処理]ボタン(Button1)をクリックすると、proc() 関数を実行して処理をします。
proc()関数では、[入力]欄のテキストボックスに入力された文字を[区切り文字]欄のテキストボックスに入力された文字列で分割します。分割結果は配列形式の items 変数に代入されます。items変数の配列数を取得し、ループ処理により、出力テキストボックスに1要素1行ずつ表示します。