正则表达式教程：HTML标签（宽松匹配）

一、正则解释

要宽松匹配HTML标签，可以使用以下正则表达式：

/<(\w+)[^>]*>(.*?<\/\1>)?/

解释：

• <：匹配开标签符号。
• (\w+)：捕获标签名。
• [^>]*：匹配标签名后面的所有非>字符，表示匹配任何属性。
• (：开始可选组。
• .*?：尽可能少地匹配内容。
• \/：匹配闭标签符号。
• \1：引用第一个捕获组，即标签名。
• >：匹配闭标签符号。
• )?：结束可选组。

二、使用场景

该正则表达式可用于以下场景：

• 解析HTML文档
• 从HTML中提取内容
• 验证HTML语法

三、代码示例

JavaScript

const regex = /<(\w+)[^>]*>(.*?<\/\1>)?/;

const html = '<div id="app"> 2333 </div>,<input type="text">,<br>';

const matches = html.match(regex);

console.log(matches);

Java

import java.util.regex.Matcher;
import java.util.regex.Pattern;

public class HtmlTagMatcher {

    public static void main(String[] args) {
        String html = "<div id=\"app\"> 2333 </div>,<input type=\"text\">,<br>";
        String regex = "<(\\w+)[^>]*>(.*?</\\1>)?";

        Pattern pattern = Pattern.compile(regex);
        Matcher matcher = pattern.matcher(html);

        while (matcher.find()) {
            System.out.println(matcher.group());
        }
    }
}

PHP

<?php

$html = '<div id="app"> 2333 </div>,<input type="text">,<br>';
$regex = '/<(\w+)[^>]*>(.*?<\/\1>)?/';

preg_match_all($regex, $html, $matches);

print_r($matches);

Python

import re

html = '<div id="app"> 2333 </div>,<input type="text">,<br>'
regex = r'<(\w+)[^>]*>(.*?<\/\1>)?'

matches = re.findall(regex, html)

print(matches)