如果 URL 包含 6 位数字，则将该值附加到一个类

Posted 2023-03-05

【中文标题】如果 URL 包含 6 位数字，则将该值附加到一个类

【英文标题】：If URL contains 6 digit number append the value to a class

【发布时间】：2017-08-09 02:27:55

【问题描述】：

如果此问题已得到答复，我深表歉意。我尝试过搜索，但是对此感到新鲜，也许我没有使用正确的术语。

我有一个页面，其中包含以下 pdf 示例的链接：

<a href="https://www.pdflinks.com/files/190488/nameoffile.pdf">Link1</a>
<a href="https://www.pdflinks.com/files/112254/nameoffile.pdf">Link2</a>

如果 URL 包含 6 位数字（如上）和 .pdf，是否可以使用 regex 和 JQuery 将这些值作为类添加到 href 中？所以结果是：

<a href="https://www.pdflinks.com/files/190488/nameoffile.pdf" class="pdf190488">Link1</a>
<a href="https://www.pdflinks.com/files/112254/nameoffile.pdf" class="pdf112254">Link2</a>

我尝试了以下但没有雪茄

var regex = "^[0-9]1,6$";
$('a').each(function() 
    $(this).addClass(regex.match($(this).attr("href"))[0]
);

【参考方案1】：

有几个错误：

正则表达式已锚定：没有匹配项 正则表达式初始化错误 使用方法exec 而不是match JS 无效（缺少右括号）

var regex = /[0-9]1,6/;
$('a').each(function() 
  $(this).addClass('pdf' + regex.exec($(this).attr("href"))[0]);
);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script>
<a href="https://www.pdflinks.com/files/190488/nameoffile.pdf">Link1</a>
<a href="https://www.pdflinks.com/files/112254/nameoffile.pdf">Link2</a>

另外，如果您的意思是正好是 6 位数字，请将正则表达式更改为 [0-9]6

【讨论】：

谢谢阿尤布。这成功了。欣赏解释。

1 个快速问题。您提供的代码按预期工作，但是如果有一个不符合条件的 URL（不包含 6 位数字），它将无法在该点之后的任何其他链接上工作。例如：files/190488/nameoffile.pdf">L1</a> files/nameoffile.pdf">L2</a> files/112254/nameoffile.pdf">L2</a> 结果是：files/190488/nameoffile.pdf" class="%test:190488% ">L1 files/nameoffile.pdf">L2</a> files/112254/nameoffile.pdf">L3</a>

托马斯有什么想法吗？

【参考方案2】：

您的代码存在一些问题：

你的正则表达式，"^[0-9]1,6$"

这是说您期待一个数字，长度为 1 到 6 个字符，它位于字符串的开头，也是结尾。您还将 is 设置为字符串，而您可以使用实际表达式：

var regex = /[0-9]1,6/g;

regex.match 不是方法。

您正在调用match 作为正则表达式的方法，但实际上是相反的。 match 是一个字符串方法。

$(this).attr('href').match(regex)[0]

对您的代码的更新可能如下：

var regex = /[0-9]1,6/g;

$('a').each(function() 
  var $this = $(this);
  $this.addClass('pdf' + $this.attr('href').match(regex)[0]);
);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<a href="https://www.pdflinks.com/files/190488/nameoffile.pdf">Link1</a>
<a href="https://www.pdflinks.com/files/112254/nameoffile.pdf">Link2</a>

有几种方法可以改进这一点，包括在添加类之前检查匹配是否存在。

【讨论】：

感谢 chazsolo 的解释和替代解决方案。

【参考方案3】：

以上网址：

$('a').each(function() 
  var path = $(this).attr("href");
  var str = path.split("/");
  var fileName = str[5].split(".");
  var className = fileName[1]+str[4];
  $(this).addClass(className);
);