jQueryで複数箇所をreplaceで文字列置換する方法！
jQueryで複数箇所をreplaceで文字列置換する方法についてサンプルコード付きで解説します。jQueryで複数箇所をreplaceするには少し工夫をするだけで簡単に実行することができます。では見ていきましょう。
jQueryで複数箇所をreplaceで文字列置換したい
jQueryで1箇所だけではなく、複数箇所をまとめてreplaceで文字列置換したいという場合がよくあります。
その方法について以降の項目にて解説します。
jQueryで複数箇所をreplaceで文字列置換する方法
まずシンプルにjQueryでテキストの複数箇所をreplaceで置き換えする方法について紹介します。
テキストの複数箇所をreplaceするには、/replaceしたいもの/gというように記述します。
ではサンプルコードを用意したので確認してみましょう。
このようにHTML内で記述した全ての「野球」という文字が「サッカー」に置き換わっていることが分かります。
複数の要素内で該当する文字列をすべて置換する方法
複数の要素内で該当する文字列をすべて置き換えるには.each()メソッドを用います。
ではサンプルコードを用意したので確認してみましょう。
このように複数の要素内で該当する「野球」というテキストが全て「サッカー」に置き換わっていることが分かります。
複数の文字列を一括置換する方法
置き換えたいテキストが複数ある場合以下の2つの方法にてreplaceします。
メソッドチェーンを用いる
まず1つめとしてメソッドチェーンを用います。
ではサンプルコードで確認してみましょう。
このように「野球」が「バスケットボール」に、「サッカー」が「バレーボール」に置き換わっていることが分かります。
配列とfor文を用いる
2つめとして配列にそれぞれ置き換えたいテキスト、置き換えるテキストを格納して、for文にて記述する方法があります。
ではサンプルコードで確認してみましょう。
上記のように配列とfor文を用いて記述することで、複数の文字列を一括置換できていることが分かります。
まとめ
いかがでしたでしょうか？
ぜひここで紹介した方法を用いて複数箇所をreplaceで文字列置換してみて下さい。
