使用正则表达式，我可以将网址更改为 html 图像标签 [关闭]

Posted 2023-05-08

【中文标题】使用正则表达式，我可以将网址更改为 html 图像标签 [关闭]

【英文标题】：With Regex can i change urls to html image tags [closed]

【发布时间】：2021-11-02 02:15:11

【问题描述】：

我需要你的帮助我有一个这样的网址列表

https_imgur.com/WERTYU.jpg
https_imgur.com/DRTYSF.jpg

我需要将它们更改为像这样的 html img 标签

<img src="https_imgur.com/WERTYU.jpg">
<img src="https_imgur.com/DRTYSF.jpg">

我尝试使用正则表达式，但找不到解决方案

我的想法是为img url添加前缀和后缀

【问题讨论】：

不需要正则表达式。只需使用字符串连接或模板文字。

或使用img = document.createElement("img"); img.src = url;

因为这些 url 在 wordpress 帖子中，我可以使用正则表达式查找和替换插件

嗯，这是不同的。您说您有一个 url 列表，而不是其中某处包含 url 的文本块。

是的，也许我解释得不是很好，谢谢？？？？

【参考方案1】：

假设所有 URL 都以 https_imgur.com 开头，这应该找到它们并替换它们。

let text = `Some stuff here. https_imgur.com/WERTYU.jpg
Some more stuff.
https_imgur.com/DRTYSF.jpg blah blah`;

let result = text.replace(/https_imgur\.com\/\w+\.jpg/g, '<img src="$&">');
console.log(result);

替换字符串中的$& 被替换为正则表达式的匹配项。

【讨论】：

是的，先生，它在 js 代码 sn-p 中工作

但在替换字符串中我不知道该怎么做

将其分配回您从中提取它的元素的innerHTML。

在这个例子中你会明白我的意思regex101.com/r/W8xJuz/1

选择 javascript 风格以获得 $& 替换。 regex101.com/r/5CYQ7Z/1

【参考方案2】：

考虑以下示例。

jQuery(function($) 
  var postData = $("article").html();
  var regex = /https:\/\/i.imgur\.com\/\w+\.jpg/g;
  var subst = `<img width='340' src="$&">`;
  $("article").html(postData.replace(regex, subst));
);

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<article>
  <p>Look at this.</p>
  https://i.imgur.com/qWF0ArM.jpg
  <p>Look at that.</p>
  https://i.imgur.com/qWF0ArM.jpg
  <div>https://i.imgur.com/qWF0ArM.jpg</div>
</article>

您必须检查生成的帖子的来源。然后适当调整您的选择器。