正则表达式匹配html标签,获取标签内容

简介: 正则表达式匹配html标签,获取标签内容

如何获取html中正文的内容

假设我们要获取下面html标签中的内容:

<p>桥边姑娘</p><p>你的芬芳</p><p>我把你放心上</p><p>不想让你流浪</p>
<p><span style="white-space: normal;">王者荣耀</span></p>

第一段是获取<p></p>标签内部的数据,第二个是获取<p><span></span></p>标签中的数据,其中span标签中有style属性值。

使用过正则表达式的同学肯定知道,上面两种情况其实都是一种情况,我们要获取的是尖括号括起来的一对标签中间的数据,起始标签形如<x>,结束标签形如</x>,这里的x表示的html标签。

定义正则表达式

此外,我们还需要考虑起始标签中包含style的数据,另外特殊的<br/>标签,对实际获取数据无意义,也需要过滤掉。

通过上面的分析,我们可以如下正则表达式:

<[a-zA-Z]+.*?>([\s\S]*?)</[a-zA-Z]*?>

具体处理过程

数据预处理

在使用正则表达式处理之前,我们先对数据进行预处理,比如style和<br/>标签:

/**
 * 替换掉html标签里面的style内容
 *
 * @param content
 * @return
 */
public static String replaceStyle(String content) {
    if (content == null || content.length() == 0) {
        return content;
    }
    String regEx = " style=\"(.*?)\"";
    Pattern p = Pattern.compile(regEx);
    Matcher m = p.matcher(content);
    if (m.find()) {
        content = m.replaceAll("");
    }
    return content;
}
/**
 * 移除掉</br>标签
 *
 * @param src
 * @return
 */
public static String removeBrTag(String src) {
    if (src != null && !src.isEmpty()) {
        src = src.replaceAll("<br/>", "");
    }
    return src;
}
针对标签嵌套的情况

针对多个标签嵌套的情况进行处理,比如 <p><span style="white-space: normal;">王者荣耀</span></p>,在经过预处理和正则匹配的后结果是 <span>王者荣耀,需要手工移除掉前面的起始标签,对应的方法如下:

/**
 * 针对多个标签嵌套的情况进行处理
 * 比如 <p><span style="white-space: normal;">王者荣耀</span></p>
 * 预处理并且正则匹配完之后结果是 <span>王者荣耀
 * 需要手工移除掉前面的起始标签
 * @param content
 * @return
 */
public static String replaceStartTag(String content) {
    if (content == null || content.length() == 0) {
        return content;
    }
    String regEx = "<[a-zA-Z]*?>([\\s\\S]*?)";
    Pattern p = Pattern.compile(regEx);
    Matcher m = p.matcher(content);
    if (m.find()) {
        content = m.replaceAll("");
    }
    return content;
}

具体匹配方法

/**
 * 匹配html标签,例如"<p>xxx</p>"这种格式
 */
private static Pattern HTML_TAG_PATTERN = Pattern.compile("<[a-zA-Z]+.*?>([\\s\\S]*?)</[a-zA-Z]*?>");

/**
 * 获取html中的数据
 * @param htmlString
 * @return
 */
public static List<String> getResultsFromHtml(String htmlString) {
    List<String> results = new ArrayList<>();
    // 数据预处理
    htmlString = replaceStyle(removeBrTag(htmlString));
    if (htmlString != null && htmlString.length() > 0) {
        Matcher imageTagMatcher = HTML_TAG_PATTERN.matcher(htmlString);
        // 针对多个并列的标签的情况
        while (imageTagMatcher.find()) {
            String result = "";
            // group(1)对应正则表达式中的圆括号括起来的数据
            result = imageTagMatcher.group(1).trim();

            // 针对多个标签嵌套的情况进行处理
            if (result != null && result.length() > 0) {
                result = replaceStartTag(result);
            }

            results.add(result);
        }
    }
    return results;
}

测试验证

测试方法如下:

public static void main(String[] args) {
    String ss = "<p>桥边姑娘</p><p>你的芬芳</p><p>我把你放心上</p><p>不想让你流浪</p>";
    List<String> results = getResultsFromHtml(ss);
    System.out.println("results:" + results);

    String ss1 = "<p><span style=\"white-space: normal;\">王者荣耀</span></p>";
    List<String> results1 = getResultsFromHtml(ss1);
    System.out.println("results1:" + results1);
}

output:

results:[桥边姑娘, 你的芬芳, 我把你放心上, 不想让你流浪]
results1:[王者荣耀]
相关文章
|
2月前
|
移动开发 HTML5
HTML5标签的类型
HTML5标签的类型。
66 5
|
1月前
|
移动开发 搜索推荐 UED
HTML5的新语义化标签
HTML5引入的这些新语义化标签,通过明确标识内容的结构和意义,使得网页结构更加清晰,易于理解和维护。使用这些标签不仅提升了网页的可读性和可访问性,还增强了搜索引擎和辅助技术对网页内容的解析能力。在实际开发中,合理使用这些语义化标签,能够显著提升网页的质量和用户体验。
95 49
|
27天前
|
存储 移动开发 前端开发
高效的 HTML 与 CSS 编写技巧,涵盖语义化标签、文档结构优化、CSS 预处理、模块化设计、选择器优化、CSS 变量、媒体查询等内容
本文深入探讨了高效的 HTML 与 CSS 编写技巧,涵盖语义化标签、文档结构优化、CSS 预处理、模块化设计、选择器优化、CSS 变量、媒体查询等内容,旨在提升开发效率、网站性能和用户体验。
40 5
|
1月前
|
移动开发 编解码 UED
除了 `<audio>` 和 `<video>` 标签,HTML5 还支持哪些多媒体格式?
【10月更文挑战第19天】HTML5对多种多媒体格式的支持,为网页开发者提供了丰富的选择,能够更好地满足不同类型多媒体内容在网页中的展示和交互需求,提升了网页的用户体验和多媒体应用的多样性。
|
1月前
|
存储 移动开发 前端开发
|
2月前
|
JavaScript 前端开发
电话号码正则表达式 代码 javascript+html,JS正则表达式判断11位手机号码
电话号码正则表达式 代码 javascript+html,JS正则表达式判断11位手机号码
131 1
|
2月前
|
前端开发
【HTML】img标签和超链接标签
【HTML】img标签和超链接标签
52 2
|
2月前
|
移动开发 前端开发 JavaScript
【HTML】HTML页面和常见标签
【HTML】HTML页面和常见标签
43 1
|
3月前
|
前端开发
前端基础(二)_HTML常用标签(块级标签、行级标签、行块级标签)
本文详细介绍了HTML中的常用标签,包括块级标签(如`h1`至`h6`、`p`、`div`等)、行级标签(如`span`、`b`、`strong`、`i`、`em`、`sub`、`sup`、`del`、`a`等),以及行块级标签(如`img`)。文章解释了这些标签的用途、特点和基本用法,并通过示例代码展示了如何在HTML文档中使用它们。
203 1
|
2月前
|
Web App开发 数据采集 移动开发
HTML5新增的属性和标签
HTML5新增的属性和标签
137 0