【jQuery】文字列を改行コードやbrタグで区切って配列に保存する

【jQuery】文字列を改行コードやbrタグで区切って配列に保存する

jQueryで文字列を改行コードやbrタグで区切って配列に保存する方法のまとめ。

デモはこちら

【jQuery】文字列を改行コードやbrタグで区切って配列に保存するサンプル

jQuery関連記事

関連記事をもっとみる

1.元のテキスト

HTML

PRADA<br>トートバッグ<br>BLUETTE<br>CANAPA

デモでは文字列のbrタグが見えるようにテキストボックスを使っています。

2.brタグで区切って配列に格納し、改行コードを追加

JavaScript

var str = $(".title").val();
var strArray = str.split("<br>");

var result = "";
for (var i = 0; i <= strArray.length -1; i++) {
    result += '配列'+i+' : '+strArray[i]+'\n';
}
$('.result').html(result);

1,2行目だけでbrタグで区切ってstrArray[]の中に格納されるのであとは好きなように利用するだけです!
デモでは配列がわかりやすいように改行コードをつけています。また、i <= strArray.length -1は配列が0から始まるので-1しています。

3.改行コードで区切って配列に格納し、brタグを追加

JavaScript

var str = $(".result").html();
var strArray2 = str.split(/\r\n|\r|\n/);
console.log(strArray2.length);
var result2 = "";
for (var i = 0; i <= strArray2.length -2; i++) {
    result2 += strArray2[i]+'<br>';
}
$('.result2').html(result2);

2の文字列を使って改行コードで区切ってbrタグを追加しています。本来追加する必要はまったくないんですが、デモだからということで…。
split(/\r\n|\r|\n/)は正規表現で改行コードを指定しています。それ以外はほとんど一緒ですね。
i <= strArray2.length -2;は配列が0から始まるのと、2のテキストの末尾にも改行コードが付いてしまっているので、-2しています。最後の改行コードは消した方がいいと思ったんですが消すのが面倒だったんでずるしました。

4.ajaxでテキストファイルを取得し、改行コードで区切って配列に格納

JavaScript

$.ajax({
    url:'text.txt',
    success: function(text){
        var strArray3 = text.split(/\r\n|\r|\n/);
        var result3 = "";

        for (var i = 0; i < strArray3.length; i++){
            result3 += '配列'+i+' : '+strArray3[i];
        }
        $('.result3').html(result3);
    }
});

.ajaxで外部のテキストファイルを取得し、改行コードで区切って配列に格納しています。テキストファイルの文字コードはhtmlに合わせてくださいね!
外部ファイルを使う以外は3と同じです。このサンプルの方が使い道が多そうですね。

【jQuery】文字列を改行コードやbrタグで区切って配列に保存するサンプル

phpで文字列を区切り文字で配列に分割する

phpではexplode()を使います。
詳しくはphpで文字列を区切り文字で配列に分割するexplodeで解説しています。

phpで文字列を区切り文字で配列に分割するexplode
phpとjQueryで文字列に含まれる、コンマや改行コードなどを区切り文字として配列にする方法 php関連記事 phpで文字列を区切り文字で配列に分割する php これだけで$op...

コメント

タイトルとURLをコピーしました