正規表現で文字列中のURLをaタグに置き換えしたい

HTMLタグを含む文字列の中にあるURLをaタグに置き換えしたく、正規表現を用いて以下のコードを書いて実行しました。

一応動いてはいるのですが、URLとタグ(このコードで言うところのP閉じタグ)が隣接していると、タグも含めてURLと見なしてしまうため、正しくないリンクURLが生成されてしまいます。

この正規表現をどのように改良すれば、タグを含まない純粋なaタグが作れますでしょうか？
また、「http」で始まらないURL(例えば「google.com」を「<a href="http://google.com" target="_blank">」にするなど)もaタグ化できれば尚良いのですが、これは正規表現だけでは難しいでしょうか？

以上よろしくお願いいたします。

JavaScript
1var text = '<p>あいうえおかきくけこhttp://google.com</p>';
2    text = text.replace(/(http(s)?://[\x21-\x7e]+)/gi, "<a href='$1' target='_blank'>$1</a>");
3    console.log(text);
4
5// 実行結果(p閉じタグを巻き込んでしまっている)
6// <p>あいうえおかきくけこ<a href='http://google.com</p>' target='_blank'>http://google.com</p></a>
7
8// こういう結果となってほしい
9// <p>あいうえおかきくけこ<a href="http://google.com" target="_blank">http://google.com</a></p>

行動規範の内容に同意します

回答2件

ベストアンサー

URL(URI)で使える文字は限られているので、もう少し絞ったほうが良いでしょう。
たとえばこう

javascript
1var text='<p>あいうえおかきくけこhttp://google.com</p>';
2var reg=new RegExp("((https?|ftp)(://[-_.!~*\'()a-zA-Z0-9;/?:\@&=+$,%#]+))");
3console.log(text.replace(reg,"<a href='$1' target='_blank'>$1</a>"));

しかし、厳密にやるなら、aタグのhrefの中の&を&に置き換えたりしないといけないので
細かい調整が必要かもしれません

投稿2018/02/02 05:50

yambejp

総合スコア114839

agepan

2018/02/05 01:54

ご回答頂きありがとうございました！試してみたところ、問題無くURLを抽出することができました。

行動規範の内容に同意します

[\x21-\x7e]だとマッチする文字範囲が広すぎます。
単純に"http://"の後に続く文字としてマッチする文字を、URLに使われる可能性のあるキャラクタに限定すればよいと思います。

javascript
1var text = '<p>あいうえおかきくけこhttp://google.com</p>';
2text = text.replace(/(http(s)?://[a-zA-Z0-9-.!'()*;/?:@&=+$,%#]+)/gi, "<a href='$1' target='_blank'>$1</a>");
3console.log(text);