替换<a>如果它以字符串JQuery结尾

Replace <a> if it ends with a string JQuery

本文关键字：字符串 JQuery 结尾 gt lt 替换 如果      更新时间：2023-09-26

我想找到所有具有以某些特定图像扩展名结尾的href属性的锚标记。我想用图像标签代替它们。

我尝试过以下内容，但它与任何锚都不匹配：

var imageTypes = ["jpeg", "jpg", "gif", "png", "bmp", "tif"];
$(".tfeedpost-postcontent a").each(function () {
    var actualA = $(this);
    var actualHref = $(this).attr("href");
    if (actualHref.match(imageTypes)) {
      actualA.replaceWith("<img src='" + actualHref + "'>");
    }
});

我也试过这个：

if (actualHref.match(imageTypes + "$")) {
      //...
}

如果我放以下内容，它是有效的，但显然只有一种类型的图像。

if (actualHref.match("jpg$")) {
      //...
}

我怎样才能找到任何扩展的匹配项？

您可以使用管道运算符（在正则表达式中充当OR），并要求它前面有一个点，并出现在字符串（$）的末尾：

 if (actualHref.match(/'.(jpeg|jpg|gif|png|bmp|tif)$/)) {
     ....
 }

下面的扩展也将正确处理那些具有看起来像图像扩展的参数或哈希的URL

 if (actualHref.match(/^[^?#]*'.(jpeg|jpg|gif|png|bmp|tif)($|[?#])/)) { ...

此表达式要求在匹配的扩展名之前不出现"？"或"#"，并允许其中一个出现在它的正后方。

以下操作将满足您的需要：

var imageTypes = ["jpeg", "jpg", "gif", "png", "bmp", "tif"];
$(".tfeedpost-postcontent a").each(function () {
    var url = $(this).attr("href");
    var ext = url.split('#').shift().split("?").shift().split('.').pop();
    if ($.inArray(ext, imageTypes) > -1) {
      $(this).replaceWith("<img src='" + url + "'>");
    }
});

jsFiddle

edit：更新以反映epascarello和trincot 提到的案例

如果您想使用类型数组，请取出文件类型，并使用indexOf查看它是否在数组中

var fType = actualHref.split("/").pop().split(".")[1]
var isImg = imageTypes.indexOf(fType)>-1;

如果末尾有一个查询字符串，这种方法就会失败。您最好使用.pathname而不是.href

相关文章：