JavaScript实现正则去除a标签并保留内容的方法【测试可用】


Posted in Javascript onJuly 18, 2018

本文实例讲述了JavaScript实现正则去除a标签并保留内容的方法。分享给大家供大家参考,具体如下:

一、问题:

有如下HTML代码,要求用正则去除a标签,只留下内容 //3water.com

<a href="//3water.com/" 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;">//3water.com</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 xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>js正则删除a标签并保留内容</title>
</head>
<body>
<a href="//3water.com/" 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;">//3water.com</span></a>
<script>
var str=document.getElementsByTagName('a')[0].outerHTML;
console.log("正则删除之前:"+str);
str=str.replace(/(<\/?a.*?>)|(<\/?span.*?>)/g, '');
console.log("正则删除之后:"+str);
</script>
</body>
</html>

使用在线HTML/CSS/JavaScript代码运行工具:http://tools.3water.com/code/HtmlJsRun,测试结果如下:

JavaScript实现正则去除a标签并保留内容的方法【测试可用】

Javascript 相关文章推荐
JavaScript延迟加载
Mar 09 Javascript
js加解密 脚本解密
Feb 22 Javascript
基于jquery的图片懒加载js
Jun 30 Javascript
JavaScript继承方式实例
Oct 29 Javascript
input禁止键盘及中文输入,但可以点击
Feb 13 Javascript
《JavaScript函数式编程》读后感
Aug 07 Javascript
JS实现的3D拖拽翻页效果代码
Oct 31 Javascript
javascript创建对象的3种方法
Nov 02 Javascript
Vue+Element使用富文本编辑器的示例代码
Aug 14 Javascript
阿里大于短信验证码node koa2的实现代码(最新)
Sep 07 Javascript
Vue-cli 使用json server在本地模拟请求数据的示例代码
Nov 02 Javascript
原生js实现省市区三级联动代码分享
Feb 12 Javascript
微信小程序scroll-x失效的完美解决方法
Jul 18 #Javascript
详解easyui基于 layui.laydate日期扩展组件
Jul 18 #Javascript
Vue无限滑动周选择日期的组件的示例代码
Jul 18 #Javascript
微信小程序修改swiper默认指示器样式的实例代码
Jul 18 #Javascript
webpack4.x打包过程详解
Jul 18 #Javascript
vue系列之requireJs中引入vue-router的方法
Jul 18 #Javascript
Vue隐藏显示、只读实例代码
Jul 18 #Javascript
You might like
用PHP连接MySQL代码的参数说明
2008/06/07 PHP
网页的分页下标生成代码(PHP后端方法)
2016/02/03 PHP
thinkPHP内置字符串截取函数用法详解
2016/11/15 PHP
利用laravel搭建一个迷你博客实战教程
2017/08/13 PHP
php微信开发之音乐回复功能
2018/06/14 PHP
PHP For循环字母A-Z当超过26个字母时输出AA,AB,AC
2020/02/16 PHP
JavaScript中的Document文档对象
2008/01/16 Javascript
jQuery图片预加载 等比缩放实现代码
2011/10/04 Javascript
JavaScript实现班级随机点名小应用需求的具体分析
2014/05/12 Javascript
js实现带圆角的两级导航菜单效果代码
2015/08/24 Javascript
jQuery插件扩展测试实例
2016/06/21 Javascript
Bootstrap编写一个在当前网页弹出可关闭的对话框 非弹窗
2016/06/30 Javascript
原生JS实现-星级评分系统的简单实例
2016/08/21 Javascript
js控制li的隐藏和显示实例代码
2016/10/15 Javascript
jquery.masonry瀑布流效果
2017/05/25 jQuery
JavaScript严格模式下关于this的几种指向详解
2017/07/12 Javascript
vue实现条件判断动态绑定样式的方法
2018/09/29 Javascript
js 实现ajax发送步骤过程详解
2019/07/25 Javascript
layui 弹出删除确认界面的实例
2019/09/06 Javascript
JavaScript实现PC端四格密码输入框功能
2020/02/19 Javascript
详解JavaScript自定义函数
2020/07/29 Javascript
JSON stringify方法原理及实例解析
2020/10/23 Javascript
[51:17]Mski vs VGJ.S Supermajor小组赛C组 BO3 第三场 6.3
2018/06/04 DOTA
[51:36]Optic vs Newbee 2018国际邀请赛小组赛BO2 第一场 8.17
2018/08/18 DOTA
[56:42]完美世界DOTA2联赛循环赛 Matador vs Forest 第二场 11.06
2020/11/06 DOTA
transform python环境快速配置方法
2018/09/27 Python
python 给图像添加透明度(alpha通道)
2020/04/09 Python
Marlies Dekkers内衣美国官方网上商店:高端内衣品牌
2018/11/12 全球购物
Myprotein俄罗斯官网:欧洲第一运动营养品牌
2019/05/05 全球购物
美国在线医疗分销商:MedEx Supply
2020/02/04 全球购物
技术学校毕业生求职信分享
2013/12/02 职场文书
《彩色世界》教学反思
2014/04/12 职场文书
教师竞聘演讲稿
2014/05/16 职场文书
股东出资证明书(正规版)
2014/09/24 职场文书
公司客户答谢酒会祝酒词
2015/08/11 职场文书
如何用JS实现简单的数据监听
2021/05/06 Javascript