正则表达式处理图片地址、img标签的方法

再上传表情或者图片地址时候很多时候不能直接上传<img src=" " />，因此在上传评论或者图片之前应该先处理一下img标签。举例如下，希望可以帮助更多的程序猿~

<span style="font-size:14px;">//第一步是获取到带有img标签的字符串
var str = '图片1<img src="arclist/sanai.png">图片2<img src="arclist/em_23.gif">图片3<img src="arclist/451.gif">';</span>

处理获取到的字符串

<span style="font-size:14px;">//将img标签替换为特定编码方式的表达式
var reg = /<img[^>]*src[=\"\'\s]+[^\.]*\/([^\.]+)\.[^\"\']+[\"\']?[^>]*>/gi;
str = str.replace(reg, "[face:$1.gif]");
console.log(str);</span>

运算结果为：

<span style="font-size:14px;">图片1[face:sanai.gif]图片2[face:em_23.gif]图片3[face:451.gif]</span>

这样上传到服务器的代码就不会存在html标签，这是一种很好的应对带有图片评论且上传信息禁止html标签的方法。

接下来：

从服务器上返回的上一步中的运行结果，在反向解析，方法如下：

<span style="font-size:14px;">//将特定编码方式替换成img标签的表达式
var regg = /
face:([\w]+).gif
/gi;
str = str.replace(regg,"<img src='images/$1.gif' />");
console.log(str);</span>

运行结果为：

<span style="font-size:14px;">图片1<img src='images/sanai.gif' />图片2<img src='images/em_23.gif' />图片3<img src='images/451.gif' /></span>

下面附上代码的html页，可以全部复制粘贴到html文件中直接运行，亲测可用

<span style="font-size:14px;"><!DOCTYPE html>
<html>
 <head>
  <meta charset="UTF-8">
  <title></title>
 </head>
 <body>
  <script>
   var str = '图片1<img src="arclist/sanai.png">图片2<img src="arclist/em_23.gif">图片3<img src="arclist/451.gif">';
   //将img标签替换为特定编码方式的表达式
   var reg = /<img[^>]*src[=\"\'\s]+[^\.]*\/([^\.]+)\.[^\"\']+[\"\']?[^>]*>/gi;
   str = str.replace(reg, "[face:$1.gif]");
   console.log(str);
   //将特定编码方式替换成img标签的表达式
   var regg = /
face:([\w]+).gif
/gi;
   str = str.replace(regg,"<img src='images/$1.gif' />");
   console.log(str);
  </script>
 </body>
</html></span>

以上两种方法很好的解决的对img标签的正反运算，第一种方法为之前收集，不记得原作者，如有冒犯可以提出署名。后一种方法为本人自写，存在一定的局限性，欢迎大家讨论~

以上所述是小编给大家介绍的正则表达式处理图片地址、img标签的方法，希望对大家有所帮助，如果大家有任何疑问请给我留言，小编会及时回复大家的。在此也非常感谢大家对我们网站的支持！

赞 (0)

相关推荐

  • 用正则表达式替换图片地址img标签

    开始想到的解决方法是: 复制代码 代码如下: content.replace(/<img [^>]*src=['"]([^'"]+)[^>]*>/gi, function (match) {    console.log(match);}); 输出结果是: 复制代码 代码如下: <img src="http://www.jb51.net/images/logo.gif" alt="" width="142&

  • JavaScript正则表达式替换字符串中图片地址(img src)的方法

    本文实例讲述了JavaScript正则表达式替换字符串中图片地址(img src)的方法.分享给大家供大家参考,具体如下: 今天开发中遇到一个问题:如何替换一段HTML字符串中包含的所有img标签的src值? 开始想到的解决方法是: content.replace(/<img [^>]*src=['"]([^'"]+)[^>]*>/gi, function (match) { console.log(match); }); 输出结果是: 复制代码 代码如下: &

  • php正则表达式匹配img中任意属性的方法

    经常和图片打交道,不得不用到一些提取图片中scr.alt.title.等的属性,这里总结给大家一些常用的,感觉还不错,比较通用! PHP正则表达式匹配img中任意属性PHP 复制代码 代码如下: <?php /*PHP正则提取图片img标记中的任意属性*/ $str = '<center><img src="/uploads/images/20100516000.jpg" height="120" width="120"&

  • 正则表达式提取img的src

    要匹配的字符串:<img src=image/ad1.gif width="128" height="36"/><img src='image/ad2.gif' width="128" height="36" /> 正则表达式:<img[\s]+src[\s]*=[\s]*((['"](?<src>[^'"]*)[\'"])|(?<src>[^

  • 正则表达式处理图片地址、img标签的方法

    再上传表情或者图片地址时候很多时候不能直接上传<img src=" " />,因此在上传评论或者图片之前应该先处理一下img标签.举例如下,希望可以帮助更多的程序猿~ <span style="font-size:14px;">//第一步是获取到带有img标签的字符串 var str = '图片1<img src="arclist/sanai.png">图片2<img src="arclist/

  • Java使用正则表达式删除所有HTML标签的方法示例

    本文实例讲述了Java使用正则表达式删除所有HTML标签的方法.分享给大家供大家参考,具体如下: package com.xz.cxzy.utils; import java.util.regex.Matcher; import java.util.regex.Pattern; public class HtmlUtil { private static final String regEx_script = "<script[^>]*?>[\\s\\S]*?<\\/sc

  • ASP正则表达式清除HTML指定标签的方法

    在HTML编辑器发布过程中,会出现一些自动生成的HTML标签,或者在留言板程序应用过程中,也会出现有人恶意写入一些HTML代码的情况,所以怎么精准的过滤掉某些特定的属性标签和参数呢?下面是代码: <% Function ReplaceText(fString,patrn,replStr) Set regEx = New RegExp ' 建立正则表达式. regEx.Pattern = patrn ' 设置模式. regEx.IgnoreCase = True ' 设置是否区分大小写. regE

  • C#基于正则表达式抓取a标签链接和innerhtml的方法

    C#基于正则表达式抓取a标签链接和innerhtml的方法

    本文实例讲述了C#基于正则表达式抓取a标签链接和innerhtml的方法.分享给大家供大家参考,具体如下: //读取网页html string text = File.ReadAllText(Environment.CurrentDirectory + "//test.txt", Encoding.GetEncoding("gb2312")); string prttern = "<a(\\s+(href=\"(?<url>([

  • PHP正则表达式抓取某个标签的特定属性值的方法

    php正则学了一些日子,抓了一些网站的数据,从而发现每次都自己写正则重新抓很麻烦,于是就想写一个抓取特定标签具有特定属性值的接口通用,直接上代码. //$html-被查找的字符串 $tag-被查找的标签 $attr-被查找的属性名 $value-被查找的属性值 function get_tag_data($html,$tag,$attr,$value){ $regex = "/<$tag.*?$attr=\".*?$value.*?\".*?>(.*?)<\

  • java正则表达式获取指定HTML标签的指定属性值且替换的方法

    实例如下: public static String repDomain(String source, String domain, String element, String attr) { String img = ""; Pattern p_image; Matcher m_image; String regEx_img = "<" + element + "[^<>]*?\\s" + attr + "=['\

  • Java基于正则表达式获取指定HTML标签指定属性值的方法

    本文实例讲述了Java基于正则表达式获取指定HTML标签指定属性值的方法.分享给大家供大家参考,具体如下: 有时可能会有这样的需求,从HTML页面获取指定标签的指定属性值,可以通过第三方库解析来获取,但是这样相对比较麻烦! 如果使用正则表达式,那么就变得简单了.代码如下: package com.mmq.regex; import java.util.ArrayList; import java.util.List; import java.util.regex.Matcher; import

  • Python使用正则表达式过滤或替换HTML标签的方法详解

    本文实例讲述了Python使用正则表达式过滤或替换HTML标签的方法.分享给大家供大家参考,具体如下: python正则表达式关键内容: python正则表达式转义符: . 匹配除换行符以外的任意字符 \w 匹配字母或数字或下划线或汉字 \s 匹配任意的空白符 \d 匹配数字 \b 匹配单词的开始或结束 ^ 匹配字符串的开始 $ 匹配字符串的结束 \W 匹配任意不是字母,数字,下划线,汉字的字符 \S 匹配任意不是空白符的字符 \D 匹配任意非数字的字符 \B 匹配不是单词开头或结束的位置 [^

  • 用JavaScrip正则表达式验证form表单的方法

    用JavaScrip正则表达式验证form表单的方法

    document:标签之间 location:url history:前进后退 <html> <head> <script type="text/javascript"> function show() { //弹出一个提示框 window.alert("hh"); } //将show方法绑定到按钮上 window.onload=function() { //定位到按钮 var buttonElement=document.for

随机推荐