<img↵ class="image-lazy image-reload"↵ alt=""↵ src="https://static.ws.126.net/163/frontend/images/2022/empty.png"↵ data-src="http://dingyue.ws.126.net/2023/0507/9971b4cfj00ru9z1q005ad200u0011gg00id00mx.jpg"↵ data-no-placeholder="1"↵ data-thumbnail="750"↵ /> 例如在上述代码中,内容存放在一个变量中,我想删除src中的内容保留data-src中的内容,再将修改后的内容传入变量中,又该怎么做
时间: 2024-03-31 09:34:07 浏览: 266
vue生命周期来解释为什么vue-awesome-swiper插件中length=01
你可以使用正则表达式来实现这个需求。具体步骤如下:
1. 用正则表达式匹配字符串中的 `src` 和 `data-src` 属性值,并将其分别存储在两个变量中。
```
const str = '<img class="image-lazy image-reload" alt="" src="https://static.ws.126.net/163/frontend/images/2022/empty.png" data-src="http://dingyue.ws.126.net/2023/0507/9971b4cfj00ru9z1q005ad200u0011gg00id00mx.jpg" data-no-placeholder="1" data-thumbnail="750" />';
const regex = /src="([^"]+)"\s+data-src="([^"]+)"/;
const match = regex.exec(str);
const src = match[1];
const dataSrc = match[2];
```
2. 用修改后的 `data-src` 属性值替换 `src` 属性值,并将修改后的字符串存储在一个变量中。
```
const newStr = str.replace(src, dataSrc);
```
现在,`newStr` 变量中存储的就是修改后的 HTML 代码。你可以将其传入你的变量中,以便后续使用。
阅读全文