如何简化这个正则表达式来选择Blogger图像参数

Question

早上好，我写了以下正则表达式：

/sBd{2,4}-c|wBd{2,4}-hBd{2,4}-c|wBd{2,4}-hBd{2,4}|wBd{2,4}|hBd{2,4}|wBd{2,4}-c|hBd{2,4}-c/

用于选择所有可能的情况

/s1600/
/s1600-c/
/w80-h50/
/w300-h480-c/
/w80/
/w80-c/
/h50/
/h50-c/

但我认为这是一个漫长而艰难的过程，我怎么能做得更好呢？我正在编写的代码用于选择Blogger中托管的图像的参数。

Answer 1

使用

/[a-z]d{2,4}(?:-[a-z]d{2,4})?(?:-[a-z])?/

查看验证

说明：

NODE                     EXPLANATION
--------------------------------------------------------------------------------
[a-z]                    any character of: 'a' to 'z'
--------------------------------------------------------------------------------
d{2,4}                  digits (0-9) (between 2 and 4 times
(matching the most amount possible))
--------------------------------------------------------------------------------
(?:                      group, but do not capture (optional
(matching the most amount possible)):
--------------------------------------------------------------------------------
-                        '-'
--------------------------------------------------------------------------------
[a-z]                    any character of: 'a' to 'z'
--------------------------------------------------------------------------------
d{2,4}                  digits (0-9) (between 2 and 4 times
(matching the most amount possible))
--------------------------------------------------------------------------------
)?                       end of grouping
--------------------------------------------------------------------------------
(?:                      group, but do not capture (optional
(matching the most amount possible)):
--------------------------------------------------------------------------------
-                        '-'
--------------------------------------------------------------------------------
[a-z]                    any character of: 'a' to 'z'
--------------------------------------------------------------------------------
)?                       end of grouping

Answer 2

我用基于他们给我的答案的代码回答我的问题：

[swh]d{2,4}(?:-[swh]d{2,4})?(?:-c)?

我写了"；swh"；因为在Blogger中，图像的参数只能是s、w、h，并且在表达式的末尾，该组查找"-c"；如果它存在，因为它是Blogger添加或不添加的唯一一个。

使用此正则表达式，您可以选择图像参数，例如：

https://2.bp.blogspot.com/-vp696X1HSrA/XaaHyg5BeCI/AAAAAAAAEKs/1JFSJw7LfF0VvWEyifpPd3yqUg92jIG9wCLcBGAsYHQ/s1600/white-ceramic-teacup-in-white-ceramic-saucer-on-railings.jpeg
https://4.bp.blogspot.com/-bX3sMYWmk28/XaaNjJOgAII/AAAAAAAAELM/FfsSjoMMRRIMYra8H4jJcAUDekykUHnUQCLcBGAsYHQ/w450-h640/landscape-photography-of-metal-footbridge-leading-to-the-lake.jpeg

这允许我们更改另一个参数：

var items = document.querySelectorAll("img");

function changeParams() {
for (var i = items.length; i--;) {
var img = items[i];
src = img.src.replace(/[swh]d{2,4}(?:-[swh]d{2,4})?(?:-c)?/, "s80-c");
img.src = src;
}
}

<button onclick="changeParams()">Change parameters</button>
<img src="https://2.bp.blogspot.com/-vp696X1HSrA/XaaHyg5BeCI/AAAAAAAAEKs/1JFSJw7LfF0VvWEyifpPd3yqUg92jIG9wCLcBGAsYHQ/s600/white-ceramic-teacup-in-white-ceramic-saucer-on-railings.jpeg"/>
<img src="https://4.bp.blogspot.com/-bX3sMYWmk28/XaaNjJOgAII/AAAAAAAAELM/FfsSjoMMRRIMYra8H4jJcAUDekykUHnUQCLcBGAsYHQ/w450-h640/landscape-photography-of-metal-footbridge-leading-to-the-lake.jpeg"/>
<img src="https://1.bp.blogspot.com/-JLtfBusE8vs/XYLX84sOq4I/AAAAAAAAEGY/nL1Ggut-Ny03LMhhrlB2swD5vROHb3ePQCLcBGAsYHQ/s400-c/snow-covered-mountain-night.jpeg"/>
<img src="https://2.bp.blogspot.com/-I-ADLFVdY64/XaaHO27Td9I/AAAAAAAAEKk/yhZ6b07CsZ07gxJeaSJQNvxh2fkiU0hcACLcBGAsYHQ/w500-h640-c/white-and-black-mountain.jpeg"/>

非常感谢大家，我从你们身上学到了很多。