【JavaScript】HTMLタグで囲まれた文字列をタグごと抜き出すための正規表現

村上 著者:村上

【JavaScript】HTMLタグで囲まれた文字列をタグごと抜き出すための正規表現

今後もしかしたら再び使うことがあるかもしれないので、備忘録としてまとめ。
HTMLタグに囲まれた文字列をタグごと抜き出すための正規表現です。
具体的には下記のような文字列をイメージしています。

サンプルテキスト。<b>太字</b> <a>リンク</a>

上記の文字列から、<b>太字</b><a>リンク</a> を抜き出します。

 

今回作成した正規表現はこちら。

const tags = [検索したい文字列].match(/<\w*>\S*<\/\w*>/g);

タグで囲まれた文字をごそっと取ってくるのが目的なので、こんな感じで記述しました。
実際に試してはいませんが、多分 <img>タグ とかには反応しないと思います。
上記を実行すると、正規表現のパターンに一致した文字列が、配列の形で変数 tags に格納されます。
なお、g を指定しているので、繰り返しマッチングを行います。

ちなみに、タグで囲まれた文字列と、タグの中身を取得するには下記の正規表現を使いました。

const tagData = [検索したい文字列].match(/<(\w*)>(\S*)<\/\w*>/);

変数 tagData には配列でそれぞれの文字列が格納され、tagData[1] には、タグの中身が、tagData[2] には、タグで囲まれていた文字列が格納されているはずです。
念のため、console.log() を使って、実際に格納されている値を確認してください。
なお、こちらは繰り返しマッチングを行っていないので、ご注意ください。
私は一つ目の正規表現でタグをまるっと抜き出し、それを繰り返し処理で回しながら、二つ目の正規表現でタグの中身と、タグで囲まれた文字列を抜き出すようにしました。

 

以上、HTMLタグで囲まれた文字列を、タグごと抜き出す方法でした。
もしかしたら、もっといい方法があるのかもしれませんが…特にこれでも困らないので、今のところ問題はありません。
お困りの方の参考になれば幸いです。

  • この記事いいね! (0)

著者について

村上

村上 administrator