Dreamweaver 正则表达式查找和替换以添加 webp 图像

Question

我想在一个大的静态站点中找到所有的jpg并添加webp

所以我需要找到

<img src="image/path/my be/long/new_2.jpg" alt="descriptive tag blah"  />

并替换为

         <picture>
            <source srcset="image/path/amy be/long/new_2.webp" type="image/webp"> 
            <img src="image/path/my be/long/new_2.jpg" alt="descriptive tag blah"  />
         </picture>

我尝试了各种方法，但我真的不熟悉正则表达式，所以我得到的最接近的是

<img src="([^"]+)" alt="(.*?)"  />

并替换为

         <picture>
            <source srcset=".webp" type="image/webp"> 
            <img src="" alt=""  />
         </picture>

但是文件扩展名 .jpg.webp

正则表达式是一个很大的话题，非常欢迎任何有经验的人对此提供帮助

Answer 1

要调整正则表达式以匹配没有 .jpg 的源，您可以使用此正则表达式：

它匹配：

a-z：小写字符
0-9: 数字
\/: 斜杠
\s: 空格
_: 下划线

并以 .jpg"

结束

<img src="([a-z0-9\/\s_]+).jpg" alt="(.*?)"  \/>

Dreamweaver 正则表达式查找和替换以添加 webp 图像

dreamweaver regex find and replace to add webp images

regex

dreamweaver

webp