问题：
javascript - js如何使用正则表达式把富文本中第一个img的src匹配出来拼接成一个数组？
孔寒
后台返回一个res.data是一个数组对象，每一个对象里面有一个content属性，是如下的富文本
"<html><body><p style="text-align:center"><img alt="" src="/upload/BContent/20231222160711title.bmp" style="width:550px; height:365px"></p><p style="text-align:center"> </p><p style="text-align:justify"><span style="font-size:18px"><span style="font-family:SimSun">各相关雷达厂商：</span></span></p><p style="text-align:justify"><span style="font-size:18px"><span style="font-family:SimSun"> 为进一步做好北海区X波段岸基测冰雷达建设前期准备工作，我中心现诚挚邀请相关雷达厂商开展X波段岸基测冰雷达现场比测，根据目前海冰发展安排各项具体事项如下：</span></span></p><p style="text-indent:21.0pt; text-align:justify"><span style="font-size:18px"><span style="font-family:SimSun">1．比测时间：2023年12月底至2024年3月中旬。</span></span></p><p style="text-indent:21.0pt; text-align:justify"><span style="font-size:18px"><span style="font-family:SimSun">2．比测地点：辽宁省盘锦市辽滨金帛滩或大连温坨子海洋站</span></span></p><p style="text-indent:21.0pt; text-align:justify"><span style="font-size:18px"><span style="font-family:SimSun">3．比测总体要求：要求仪器设备在比测期间每日开展定时自动化观测，能实时、连续、大面的监测量程范围内的海冰信息。</span></span></p><p style="text-indent:21.0pt; text-align:justify"><span style="font-size:18px"><span style="font-family:SimSun">4．比测具体要素：浮冰冰型、浮冰厚度、浮冰密集度、浮冰漂移方向和速度、冰表面特征、海冰分布面积等。其中冰厚等监测要素的空间分辨率不大于10米。</span></span></p><p style="text-indent:21.0pt; text-align:justify"><span style="font-size:18px"><span style="font-family:SimSun">5．比测成果要求：比测过程中每日需向我中心指定服务器自动发送雷达原始回波数据图像、转换为CGCS2000坐标系后的回波数据图像、解译后的海冰各要素分布图（矢量化）、网格化的冰厚数据产品以及每日监测简报。</span></span></p><p style="text-indent:21.0pt; text-align:justify"><span style="font-size:18px"><span style="font-family:SimSun">6．报名与参测：请有意参与此次现场比测工作的厂商，于2023年12月25日前正式复函我中心，随函提供相关资质与业绩材料。受场地限制，我中心将根据提交材料的顺序与符合性选择3-5家厂商参与。其他具体事项将在确定参测厂家后另行通知。</span></span></p><p style="text-indent:21.0pt; text-align:justify"><span style="font-size:18px"><span style="font-family:SimSun">7．保障与分工：比测期间，我中心将与盘锦市自然资源局和大连海洋中心合作提供盘锦与温坨子比测地点的场地、安保与供电。其他差旅、运输、塔架租赁、安装和耗材等均由参测厂商自行负担。</span></span></p><p style="text-indent:21.0pt; text-align:justify"><span style="font-size:18px"><span style="font-family:SimSun">8．比测成果应用：本次比测结果将作为北海区后续雷达建设的重要技术参考。</span></span></p><p style="text-align:justify"><span style="font-size:18px"><span style="font-family:SimSun"> 联系人：黎舸 手机号：13791940068 邮箱：lige@ncs.mnr.gov.cn</span></span></p><p style="text-align:justify"><span style="font-size:18px"><span style="font-family:SimSun"> 传真号码：0532-58750682</span></span></p><p style="text-align:center"><img alt="" src="/upload/BContent/20231222160912tu-1.png" style="width:558px; height:315px"></p><p align="center" style="text-align:center"><span style="font-size:10.5pt"><span style="font-family:"Calibri","sans-serif""><span style="font-family:宋体">图1 盘锦市比测地点现场照片-1</span></span></span></p><p align="center" style="text-align:center"><span style="font-size:10.5pt"><span style="font-family:"Calibri","sans-serif""><span style="font-family:宋体">比测地点位于辽宁省盘锦市辽滨金帛滩，宜必思酒店楼顶。</span></span></span></p><p align="center" style="text-align:center"> </p><p align="center" style="text-align:center"><img alt="" src="/upload/BContent/20231222160944tu-2.png" style="width:558px; height:315px"></p><p align="center" style="text-align:center"><span style="font-size:10.5pt"><span style="font-family:"Calibri","sans-serif""><span style="font-family:宋体">图2 盘锦市比测地点现场照片-2</span></span></span></p><p align="center" style="text-align:center"><span style="font-size:10.5pt"><span style="font-family:"Calibri","sans-serif""><span style="font-family:宋体">比测地点位于辽宁省盘锦市辽滨金帛滩，宜必思酒店楼顶。</span></span></span></p><p style="text-align:justify"> </p></body></html>"把每个富文本中的第一个src的连接比对出来，拼接成一个ImageList
images: [ 'http://www.xxx.org.cn/upload/BContent/202309051056040-%E5%9B%BE1.jpg', 'http://www.xxx.org.cn/upload/BContent/20231108165526title-1.bmp', 'http://www.xxx.org.cn/upload/BContent/20230816101744tu1%20%E7%94%9F%E6%80%81%E6%97%A5%E6%A0%87%E8%AF%86.jpg', 'http://www.xxx.org.cn/upload/BContent/202305171507340-%E5%9B%BE%E7%89%871%E5%BF%97%E6%84%BF%E8%80%85%E5%90%88%E7%85%A7.jpg', 'http://www.xxxx.org.cn/upload/BContent/20230403171340%E5%B7%A5%E4%BD%9C%E4%BC%9A-1.bmp' ],共有1个答案
酆英达
可以试试 DOMParser
const parser = new DOMParser();const htmlStr = "some html string";const html = parser.parseFromString(htmlStr, "text/html");const images = Array.from(html.querySelectorAll("img")).map((img) => img.src);
类似资料：
-
根据下面的示例，我有一个正则表达式模式。 但是，作为一个一次性的派生，如果只有一个模式（匹配第一个实例的空白行&模式上方的一个空格），我可以让下面的内容匹配。 http://regex101.com/r/ey0ic7 但是，如果模式位于第一行，则没有匹配。
-
给定下面的字符串 [NeMo（PROD）]10.10.100.100（EFA-B-3）[博科FC-Switch]传感器：电源#1（SNMP自定义表）关闭（无此名称（SNMP错误#2）） 我尝试获取多个匹配项以提取以下值： 因为我是正则表达式的初学者，所以我试图定义一些“规则”： 提取第一个圆括号内的第一个值，例如PROD 提取第一个闭合方括号和第二个开口圆括号之间的值，例如10.10.100.10
-
我试图使用正则表达式来检查字符串中的第一个和最后一个字符是否是a-z之间的字母字符。 我知道这与第一个字符匹配： 但是我如何检查最后一个字符呢？ 这： 不起作用。我怀疑这两个条款之间应该有什么区别，但我不知道是什么！
-
问题内容： 如何匹配“ Hello world”或“ Hello World”形式的句子。该句子可能包含“-/数字0-9”。任何信息对我都会非常有帮助。谢谢。 问题答案： 这将做得很好。我对句子的定义：句子以非空格开头，以句点，感叹号或问号（或字符串结尾）结尾。标点符号后可能会有一个结束语。 这是输出： 正确地匹配所有这些（最后一个句子没有结尾标点符号），看起来似乎并不那么容易！
-
问题内容： 我只是想知道是否可以使用一个正则表达式来匹配另一个，这是某种形式的： 正则表达式完全可以实现这种功能吗？我正在使用python进行工作，因此有关该模块实现的任何建议都将有所帮助，但我将尽我所能获取有关正则表达式的信息。 编辑：好的，显然需要按顺序进行澄清！我绝对知道正常的匹配语法如下所示： 但是我想知道正则表达式是否能够匹配我在上面试图解释的非语法正确版本中的其他较不具体的表达式，bx
-
问题内容： 是的，您没看错。我需要能够从正则表达式 生成 随机文本的内容。因此，文本应该是随机的，但要与正则表达式匹配。看来它不存在，但我可能是错的。 仅举一个例子：该库将能够以“ ”作为输入，并生成诸如以下示例： abc abbbc bac 等等 更新：我自己创建了一些东西：Xeger。查看http://code.google.com/p/xeger/。 问题答案： 我刚刚创建了一个库来进行此操