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

本文实例讲述了JavaScript实现正则去除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 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="//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>
<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.jb51.net/code/HtmlJsRun,测试结果如下:

PS:这里再为大家提供2款非常方便的正则表达式工具供大家参考使用:

JavaScript正则表达式在线测试工具:
http://tools.jb51.net/regex/javascript

正则表达式在线生成工具:
http://tools.jb51.net/regex/create_reg

更多关于JavaScript相关内容感兴趣的读者可查看本站专题:《JavaScript正则表达式技巧大全》、《JavaScript替换操作技巧总结》、《JavaScript查找算法技巧总结》、《JavaScript数据结构与算法技巧总结》、《JavaScript遍历算法与技巧总结》、《JavaScript中json操作技巧总结》、《JavaScript错误与调试技巧总结》及《JavaScript数学运算用法总结》

希望本文所述对大家JavaScript程序设计有所帮助。

(0)

相关推荐

  • JS实现标签滚动切换效果

    本文的JS效果是在鼠标点击ITEM标签的时候,实现下方的内容跟随滚动切换的效果,我们先来看下运行后的效果图. 以下是我们原创的运行代码: <!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

  • JS实现的简单标签点击切换功能示例

    本文实例讲述了JS实现的简单标签点击切换功能.分享给大家供大家参考,具体如下: 先来看看运行效果: 具体代码如下: <!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8"> <title>www.jb51.net 我们</title> <style> * { margin: 0; padding: 0; } ul {

  • JS点击动态添加标签、删除指定标签的代码

    1.div标签 <div id="mDiv3"> <p>1</p> <button onclick="myFun9()">添加</button> </div> 2.js function myFun9() { var mDiv3 = document.getElementById("mDiv3"); //获取组件1 var eleme = document.createEle

  • JavaScript实现的原生态Tab标签页功能【兼容IE6】

    本文实例讲述了JavaScript实现的原生态Tab标签页功能.分享给大家供大家参考,具体如下: 标签页是一个很常见的东西,在一些框架中也就很常见的, 但未必所有人都知道怎么写,很多人知道怎么在网上复制一份是真的, 这样不好,往往需要用大量的时间去修改网上复制下来的东西,还不如自己写一份快. 一.基本目标 创建一个如下的标签页,在IE8中与谷歌浏览器中的效果如下,几乎没有区别 谷歌浏览器: IE8: 二.制作过程 1.首先布置好场景,在一个图层内: 图层1~图层4四个超级链接是一个图层,然后各自

  • 详解JavaScript添加给定的标签选项

    先看看效果图: 代码实现: HTML代码: <h3>haveTags</h3> <div id="havetags"></div> <hr /> <h3>addTags</h3> <div id="addtags"></div> <button id="btn">返回的数组</button> css代码: #have

  • js + css实现标签内容切换功能(实例讲解)

    先附上效果图和代码: html 文档: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <script type="text/javascript" src="../js/tabs_function.js"></scri

  • js统计页面上每个标签的数量实例代码

    具体代码如下所示: function fold(node){ var map = new Map(); map.set(node.tagName,1); [].reduce.call(node.children,(acc,child)=>{ deal(acc,fold(child)); return acc },map) return map } function deal(srcMap,tarMap){ tarMap.forEach((value,tagName)=>{ var newV =

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

    本文实例讲述了JavaScript实现正则去除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 c

  • C#正则过滤HTML标签并保留指定标签的方法

    本文实例讲述了C#正则过滤HTML标签并保留指定标签的方法.分享给大家供大家参考,具体如下: 这边主要看到一个过滤的功能: public static string FilterHtmlTag(string s) { //<...>标记正则表达式 return Regex.Replace(s, @"<[^>]*>", delegate(Match match) { string v = match.ToString(); //图片,<p>,&l

  • JavaScript trim 实现去除字符串首尾指定字符的简单方法

    实例如下: String.prototype.trim = function (char, type) { if (char) { if (type == 'left') { return this.replace(new RegExp('^\\'+char+'+', 'g'), ''); } else if (type == 'right') { return this.replace(new RegExp('\\'+char+'+$', 'g'), ''); } return this.re

  • java正则替换img标签中src值的方法

    主要功能是: 替换html字符串中img标签src的值. 代码如下: package com.junlenet.common.util; import java.util.regex.Matcher; import java.util.regex.Pattern; /** * html处理工具类 * @author huweijun * @date 2016年7月13日 下午7:25:09 */ public class HtmlUtils { /** * 替换指定标签的属性和值 * @para

  • JS正则替换掉小括号及内容的方法

    正则表达式:\ ( [ ^ \ ) ] * \ ) JS代码: var str="hello(world)"; var nstr = str.replace(/\([^\)]*\)/g,""); 以上这篇JS正则替换掉小括号及内容的方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持我们.

  • jquery删除指定的html标签并保留标签内文本内容的方法

    例如有这样一段html代码: 复制代码 代码如下: 我们演示代码  <p>大家好,欢迎来到jb51.net</p>  这里为大家提供最优秀的<a href="http://www.jb51.net/js">js</a>代码和教程 我们希望删除这段html代码里面的一对<p>标签,但是要保持里面的内容不被删除,这里我们用jquery处理,详细的jQuery代码: 复制代码 代码如下: <script type="

  • javascript使用正则控制input输入框允许输入的值方法大全

    1.只允许输入数字 <input name="username" type="text" onkeyup="value=this.value.replace(/\D+/g,'')"> 2.只允许输入英文字母.数字和下划线(以下二种方法实现) <input name="username" type="text" style="ime-mode:disabled">

  • iOS实现去除html标签的方法汇总

    前言 我们在一些开发中,很有必要过滤掉用户输入的文本中的HTML标签以防范XSS攻击,本文将详细介绍关于iOS去除html标签的相关内容,分享出来供大家参考学习,下面话不多说了,来一起看看详细的介绍吧. 请求接口返回的数据里包含html标签,OC中去掉的方法之前做过,代码如下 -(NSString *)filterHTML:(NSString *)html{ NSScanner * scanner = [NSScanner scannerWithString:html]; NSString *

  • js正则匹配table,img及去除各种标签问题

    核心代码 //获取公示栏内容 s = "$row.detail$"; mainContent =s; //如果有多个table使用下面注释的正则只会匹配成一个table //var tabReg = /<table[^>]*>((?!table).)*<\/table>/gi; //匹配单个table var tabReg = /<table[^>]*>\s*(<tbody[^>]*>)?(\s*<tr[^>

  • PHP正则删除html代码中a标签并保留标签内容的方法 原创

    本文实例讲述了PHP正则删除html代码中a标签并保留标签内容的方法.分享给大家供大家参考,具体如下: 一.问题: 有HTML代码如: <div>欢迎访问我们<a href=http://www.jb51.net>www.jb51.net</a></div> 要求正则删除a标签,同时保留a标签内容,如下: <div>欢迎访问我们www.jb51.net</div> 二.解决方法: $str = "<div>欢迎访

随机推荐