Javascript 给定以下JS/JQUERY，如何防止它区分大小写

我有以下代码行，运行良好：

$("a.grouped_elements[href$=.jpg],a.grouped_elements[href$=.png],a.grouped_elements[href$=.gif]").fancybox();

问题是，如果href为.JPG，则它不起作用，它只与.JPG一起起作用。如何使上述内容不区分大小写，以便文件扩展名的所有大写字母或无大写字母或混合大写字母匹配

显然，谢谢你

由于我不熟悉过滤函数，我会尝试以下方法，尽管我不确定与上面提到的过滤函数相比它的效率/效率有多高：

$('a.grouped_elements').each(function(){
    var elem = $(this);
    if(elem.attr('href').match(/(gif|jpg|png)$/i) != null) {
        elem.fancybox();
    }
});

（尚未测试，但这是它的一般要点）

显然，“

由于我不熟悉过滤函数，我会尝试以下方法，尽管我不确定与上面提到的过滤函数相比它的效率/效率有多高：

$('a.grouped_elements').each(function(){
    var elem = $(this);
    if(elem.attr('href').match(/(gif|jpg|png)$/i) != null) {
        elem.fancybox();
    }
});

---

（尚未测试，但这是它的一般要点）

使用

过滤器

，@Ricket也提到了这一点。如果希望包含元素，则返回true，否则返回false

var fancyBoxable = $('a.groupd_elements').filter(function(){
    var href = $(this).attr('href') || '';
    return /(gif|jpg|png)$/i.test(href);
});

fancyBoxable.fancybox()

---

使用@Ricket也提到的

过滤器

。如果希望包含元素，则返回true，否则返回false

var fancyBoxable = $('a.groupd_elements').filter(function(){
    var href = $(this).attr('href') || '';
    return /(gif|jpg|png)$/i.test(href);
});

fancyBoxable.fancybox()

---

好了，这一切都成功了：

$('a.grouped_elements').each(function(){
    var elem = $(this);
    // Convert everything to lower case to match smart
    if(elem.attr('href').toLowerCase().match('/gif|jpg|png/') != null) {
        elem.fancybox();
    }
});

---

好了，这一切都成功了：

$('a.grouped_elements').each(function(){
    var elem = $(this);
    // Convert everything to lower case to match smart
    if(elem.attr('href').toLowerCase().match('/gif|jpg|png/') != null) {
        elem.fancybox();
    }
});

---

很有趣，但这并没有给出错误，也不起作用..？请遵循标准调试技术。。。对我来说这看起来很好，但这段代码将fancybox分别应用于每个项目，而不是同时应用于所有项目。这不是一个巨大的性能损失吗？好的，第一个错误是分组的元素缺少一个e。但即使在修复后，它仍然不工作，如果-这是正确的吗？匹配（'/（gif | jpg | png）$/i'）！=null）我不知道正则表达式？你不需要正则表达式的引号。这应该足够了：

if（elem.attr（'href'）.match（/（gif | jpg | png）$/i））{…}

很有趣，但这并没有给出错误，也不起作用..？请遵循标准调试技术。。。对我来说这看起来很好，但这段代码将fancybox分别应用于每个项目，而不是同时应用于所有项目。这不是一个巨大的性能损失吗？好的，第一个错误是分组的元素缺少一个e。但即使在修复后，它仍然不工作，如果-这是正确的吗？匹配（'/（gif | jpg | png）$/i'）！=null）我不知道正则表达式？你不需要正则表达式的引号。这应该足够了：

if（elem.attr（'href'）.match（/（gif | jpg | png）$/i））{…}

。我可以用这段代码在JSFIDLE上创建一个示例，但我更愿意让您先告诉我为什么它不适合您。我可以用这段代码在JSFIDLE上创建一个示例，但我希望您先告诉我为什么它不适合您。您应该将正确答案授予Ricket，因为他为您建议了此解决方案。同样，如果没有$，正则表达式将匹配字符串中任意位置的gif | jpg | png。$表示字符串的结尾。您应该将正确答案授予Ricket，因为他为您建议了此解决方案。此外，如果没有$，正则表达式将匹配字符串中任意位置的gif | jpg | png。$表示字符串的结尾。