美文网首页JavaScript
使用正则表达式去更改在字符串里的<img>标签的地址

使用正则表达式去更改在字符串里的<img>标签的地址

作者: Lia代码猪崽 | 来源:发表于2018-05-31 10:29 被阅读1次

使用了富文本编辑器编辑的文章内容通常都以字符串的形式保存,然后当要把文章显示出来的时候,如果文章里的图片的路径不合适,就会出现显示不出来的错误。使用正则表达式就能轻松搞定。

从百度百科找来了一张小猪佩奇的图片,原地址:https://gss0.bdstatic.com/94o3dSag_xI4khGkpoWK1HF6hhy/baike/c0%3Dbaike80%2C5%2C5%2C80%2C26/sign=09f6e7bdb919ebc4d4757ecbe34fa499/b3119313b07eca8015ffe13f9b2397dda0448374.jpg

保存下来把它放在文本编辑器里编辑一下于是:


在页面显示效果
const content = '<p>&nbsp;</p>↵<p><font color="#FF0000">这里有五只猪</font><img src="images/b3119313b07eca8015ffe13f9b2397dda0448374.jpg" /></p>';

可以知道,如果不是我本地,按照这个路径肯定找不到这张社会图。


使用正则表达式更改(把图片的绝对路径换成相对路径):

const newContent = content.replace(/src=\"image/g,  'src=\"https://gss0.bdstatic.com/94o3dSag_xI4khGkpoWK1HF6hhy/baike/c0%3Dbaike80%2C5%2C5%2C80%2C26/sign=09f6e7bdb919ebc4d4757ecbe34fa499');

注意: /原替换内容/g,这里的g是替换所有!正则表达式一般只替换第一个!

控制台的结果

相关文章

  • 使用正则表达式去更改在字符串里的<img>标签的地址

    使用了富文本编辑器编辑的文章内容通常都以字符串的形式保存,然后当要把文章显示出来的时候,如果文章里的图片的路径不合...

  • <img>标签

  • 第二篇

    2.在HTML里打多个空格需要使用标签,一般标签有<;=<,> => =空格回车标签有...

  • python--正则表达式

    正则表达式定义: 正则表达式是字符串处理的有力工具,正则表达式使用预定义的模式去匹配一类具有共同特征的字符串,可以...

  • 正则获取所有src的值

    参考文章使用正则从字符串中截取出img标签、以及对应src地址

  • 学习笔记--正则表达式

    为什么使用正则表达式? 通过使用正则表达式,可以: 测试字符串内的模式。 例如,可以测试输入字符串,以查看字符串内...

  • <img>标签,为网页插入图片

    语法: 讲解: 1、src:标识图像的位置; 2、alt:指定图像的描述性文本,当图像不可见时(下载不成功时),可...

  • 匹配

    测试地址|速查表 正则表达式是一种查找以及字符串替换操作。正则表达式在文本编辑器中广泛使用,比如正则表达式被用于:...

  • 关于正则表达式

    过滤 标签正则表达式 只过滤 标签 只过滤 标签 过滤 和 标签 按照括号分割字符串(包括中文和英文括号)如果没...

  • Python 学习笔记 060

    正则表达式 02 正则表达式 的高级用法 字符串的高级使用 正则表达式中的重复 匹配多个字符串 通过正则表达式 匹...

网友评论

    本文标题:使用正则表达式去更改在字符串里的<img>标签的地址

    本文链接:https://www.haomeiwen.com/subject/atofsftx.html