HTMLタグのマッチングと抽出の正規表現

正規表現によるHTMLタグマッチング

正規表現は完全なHTMLパーサーとして使用すべきではありませんが、シンプルなタグのマッチング、抽出、サニタイズタスクには便利です。

任意のHTMLタグにマッチ

<[^>]+>

これは任意のHTMLタグ（開始、終了、自己閉じ）にマッチします：

• <div>、</div>、<br />、<img src="..." />

特定のタグにマッチ

<(?:p|div|span)[^>]*>

特定の要素の開始タグにマッチします。非キャプチャグループ内で選択を使用します。

タグ名と属性の抽出

<(?<tag>\w+)(?<attrs>[^>]*)>

グループ：

• tag：要素名
• attrs：すべての属性（生の文字列）

個別の属性の抽出

(?<attr>\w+)=(?:"(?<val>[^"]*)"|'(?<val2>[^']*)')

ダブルクォートとシングルクォートの両方の属性値に対応します。

すべてのHTMLタグを除去

str.replace(/<[^>]+>/g, "")

すべてのHTMLタグを除去し、テキストコンテンツのみを残します。注意：属性値内の < など、すべてのエッジケースには対応しません。

自己閉じタグにマッチ

<\w+[^>]*/>

<br />、<img src="..." />、<input type="text" /> のようなタグにマッチします。

なぜ正規表現でHTMLを解析すべきでないか

• HTMLは正規言語ではなく、再帰的なネストがあります
• 正規表現はネストされたタグを正しく処理できません
• 不正なHTMLは正規表現パターンを壊します
• 信頼性の高いHTML処理にはDOMパーサー（DOMParser、cheerio、jsdom）を使用してください

既知の形式のHTMLの単純な抽出やサニタイズには正規表現で問題ありません。複雑な解析には常に適切なパーサーを使用してください。