anchorifyを使ったデモ

anchorify は文字列に含まれる URL、E-mail を HTMLのアンカータグ “<a>” に変換する Javascritp用のライブラリです。

npm i anchorify --save

yarn add anchorify

anchorifyのデモ

inputフォーム内の文字列にURL又はメールアドレスが混ざっていると、アンカータグが自動で作成されます

// code
const anchorify = require('anchorify')

var str = `この example.com がリンクタグに！`;

anchorify(str);
// この <a href="http://example.com"> example.com </a> がリンクタグに！

var str2 = `こちらの example.com に target=_blank でリンクが作成されます。`;
// 新しいタブで開くように taget _blankを指定
anchorify(str2, { target: '_blank' });
// こちらの <a href="http://example.com"rel="noreferrer noopener" target="_blank"> example.com </a> に target=_blank でリンクが作成されます。