本文实例讲述了 实现正则去除a标签并保留内容的方法。分享给大家供大家参考,具体如下:
一、问题:
有如下HTML代码,要求用正则去除a标签,只留下内容 //www.jb51.net
复制代码 代码如下:
<a href="//www.jb51.net/" style="box-sizing: border-box; color: rgb(51, 51, 51); text-decoration: none; transition: all 0.5s cubic-bezier(0.175, 0.885, 0.32, 1); -webkit-transition: all 0.5s cubic-bezier(0.175, 0.885, 0.32, 1); max-width: 100%; transparent;"><span data-wiz-span="data-wiz-span" style="box-sizing: border-box; max-width: 100%; font-size: 14pt;">//www.jb51.net</span></a>
二、解决方法:
这里使用可删除a标签与span标签的正则语句,如下:
(<\/?a.*?>)|(<\/?span.*?>)
具体js正则语句:
str.replace(/(<\/?a.*?>)|(<\/?span.*?>)/g, '');
完整测试代码如下:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html ns="http://www.w3.org/1999/xhtml">
<head>
< http-equiv="Content-Type" content="text/html; charset=utf-8" />
< >js正则删除a标签并保留内容</ >
</head>
<body>
<a href="//www.jb51.net/" style="box-sizing: border-box; color: rgb(51, 51, 51); text-decoration: none; transition: all 0.5s cubic-bezier(0.175, 0.885, 0.32, 1); -webkit-transition: all 0.5s cubic-bezier(0.175, 0.885, 0.32, 1); max-width: 100%; transparent;"><span data-wiz-span="data-wiz-span" style="box-sizing: border-box; max-width: 100%; font-size: 14pt;">//www.jb51.net</span></a>
< >
var str=document.getElementsByTagName('a')[0].outerHTML;
console.log("正则删除之前:"+str);
str=str.replace(/(<\/?a.*?>)|(<\/?span.*?>)/g, '');
console.log("正则删除之后:"+str);
</ >
</body>
</html>
使用在线HTML/CSS/ 代码运行工具:http://tools.jb51.net/code/HtmlJsRun,测试结果如下:

PS:这里再为大家提供2款非常方便的正则表达式工具供大家参考使用:
正则表达式在线测试工具:
http://tools.jb51.net/regex/
正则表达式在线生成工具:
http://tools.jb51.net/regex/create_reg
更多关于 相关内容感兴趣的读者可查看本站专题:《 正则表达式技巧大全》、《 替换操作技巧总结》、《 查找算法技巧总结》、《 数据结构与算法技巧总结》、《 遍历算法与技巧总结》、《 中json操作技巧总结》、《 错误与调试技巧总结》及《 数学运算用法总结》
希望本文所述对大家 程序设计有所帮助。
继续阅读与本文标签相同的文章
-
Spark Relational Cache实现亚秒级响应的交互式分析
2026-05-16栏目: 教程
-
带你读《射频集成电路及系统设计》之一:射频元件
2026-05-16栏目: 教程
-
带你读《5G NR标准:下一代无线通信技术》之一:5G概述
2026-05-16栏目: 教程
-
带你读《5G NR标准:下一代无线通信技术》之二:5G标准化
2026-05-16栏目: 教程
-
[转]2019年全国新农民新技术双创博览会汇聚创业创新最新成果
2026-05-16栏目: 教程
