js利用正则替换图片路径问题
/*
* 需求:给图片的src地址前面增加为assets
*
* 1. 将需要匹配的内容原封不动的写入正则表达式
* 2. 将改变的内容替换为.*?
* 3. 将.*?添加(),目的是为了能够将src中的内容单独匹配一次作为匹配结果
* 4.通过replace将内容替换
* content.replace(reg,'<img src="assets/$1" alt="">')
* */
<body>
<ul>
<li class="images"><a href="1.html"><img class="a" src="images/1.jpg" alt="134534"></a></li>
<li><a href="2.html"><img src="images/2.jpg" alt="asdfas2"></a></li>
<li><a href="3.htlm"><img src="images/3.jpg" class="b" alt="3asdf"></a></li>
<li><a href="4.html"><img src="images/4.jpg" alt="45asdf4"></a></li>
<li><a href="5.html"><img src="images/5.jpg" alt="zxcv5" title="abc"></a></li>
</ul>
</body>
<script>
//1。获取ul对象
var ul = document.querySelector('ul');
// 2.获取ul的文本内容,此时就是获取出来ul里所有的内容
var content = ul.innerHTML;
// 3.写正则表达式,先把需要改变的地址原封不动拿过来
// <img src="images/3.jpg" class="b" alt="3asdf">把不一样地方用(.*?)替换,如下
// .匹配的是非空字符*匹配任意数量?拒绝贪婪,匹配任意数量的非空字符,如果不加?,就会匹配到最后
var reg = /<img(.*?)src="(.*?)"(.*?)>/g;
var result = content.replace(reg,'<img$1src="assets/$2"$3>')
console.log(result);
</script>
js利用正则替换图片路径问题的更多相关文章
- JS利用正则配合replace替换指定字符
替换指定字符的方法有很多,在本文为大家详细介绍下,JS利用正则配合replace是如何做到的,喜欢的朋友可以参考下 定义和用法 replace() 方法用于在字符串中用一些字符替换另一些字符,或替换一 ...
- JS 利用正则表达式替换字符串
JS 利用正则表达式替换字符串 博客分类: JavaScript 学习资料 Java代码 收藏代码 JS 利用正则表达式替换字符串 var data = "123123,213,12312, ...
- JS利用正则配合replace()函数替换指定字符
定义和用法 replace() 方法用于在字符串中用一些字符替换另一些字符,或替换一个与正则表达式匹配的子串. 语法 stringObject.replace(regexp,replacement) ...
- Js 利用正则 在字符串中提取数字、替换非数字字符为指定字符串
var s ="总金额4500元"; var num= s.replace(/[^-]/ig,""); alert(num);// 上述示例会把数字匹配到直接转 ...
- js脚本 将本地图片路径转换为html
公司业务类似于电商, 因此有很多纯图片展示的商品详情页, 类似淘宝店商品页面下的多个图片组成的商品详情页, 页面很简单, 就是一大串img标签, 但是每次做详情页都要配合emmet一顿操作( 如下图 ...
- Js利用Canvas实现图片压缩
最近做的APP项目涉及到手机拍照上传图片,因为手机拍照的图片通常都比较大,所以上传的时候就会很慢.为此,需要对图片进行压缩处理来优化上传功能.以下是具体实现: /* * 图片压缩 * img 原始图片 ...
- js使用正则替换掉所有的“”
需求,使用bootstrap 的 summernote上传图片,转换成文件流,上传给后台,上传用json传送,不能有“” content = content.replace(/\"/ig,& ...
- JS用正则替换特殊字符
'abcabce'.replace(/abc/g,'') "e" 'abcabce$E$'.replace(/$E$/g,'') "abcabce$E$" 'a ...
- PHP 正则表达式匹配 img ,PHP 正则提取或替换图片 img 标记中的任意属性。
PHP正则提取或替换img标记属性 PHP 正则表达式匹配 img ,PHP 正则提取或替换图片 img 标记中的任意属性. 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 ...
随机推荐
- 516.Longest Palindromic subsequence---dp
题目链接:https://leetcode.com/problems/longest-palindromic-subsequence/description/ 题目大意:找出最长回文子序列(不连续), ...
- HOJ 1108
题目链接:HOJ-1108 题意为给定N和M,找出最小的K,使得K个N组成的数能被M整除.比如对于n=2,m=11,则k=2. 思路是抽屉原理,K个N组成的数modM的值最多只有M个. 具体看代码: ...
- PostGIS 操作geometry方法
WKT定义几何对象格式: POINT(0 0) ——点 LINESTRING(0 0,1 1,1 2) ——线 POLYGON((0 0,4 0,4 4,0 4,0 0),(1 1, 2 1, 2 2 ...
- U3D的一些常用基础脚本
修改渲染颜色和贴图 1: var texture :Texture ; 2: 3: function Start () { 4: renderer.material.mainTexture = te ...
- 基于layui+cropper.js实现上传图片的裁剪功能
最近因项目需求,需要在上传图片的时候先对图片裁剪,然后在上传,所以就有了本文的出现. 开始正文之前,要提一下这个图片的裁剪:图片的裁剪,有前端裁剪,也可以后端裁剪 前端的裁剪我知道的可以分为这么两种: ...
- JavaScript 执行环境 与 变量对象
什么是JS的执行环境? function funA(){ //一段代码静静的躺在这里,不能叫执行环境 } funA(); //当代码开始执行以后,系统会将它存入执行栈,并为他准备好足够的内存空间使用 ...
- c++ primer 10 关联容器
关联容器和顺序容器的本质差别在于:关联容器通过键(key)存储和读取元素,顺序容器则通过元素在容器中的位置顺序存储和访问元素 关联容器类型 map 关联数组:元素通过键来存储和读取 set 大小可变的 ...
- [实战]MVC5+EF6+MySql企业网盘实战(24)——视频列表
写在前面 上篇文章实现了文档列表,所以实现视频列表就依葫芦画瓢就行了. 系列文章 [EF]vs15+ef6+mysql code first方式 [实战]MVC5+EF6+MySql企业网盘实战(1) ...
- spring boot 使用不同的profile来加载不同的配置文件
在开发过程之中,经常需要在开发和测试环境中进行互相切换,当切换的同时需要加载相应的配置文件,因此要经常 性的对配置文件进行相应的修改,长此以往感到十分痛苦.如果能针对开发和测试环境分别建两个不同的配置 ...
- 【LOJ】#2014. 「SCOI2016」萌萌哒
题解 这个题好妙啊 首先我们发现,如果我们可以暴力,就是把相同的元素拿并查集合起来,最后统计集合个数\(cnt\) 答案是\(9\*10^{cnt - 1}\) 然而我们做不到= = 我们可以用倍增的 ...