DIV 结构的 JS

Question

我正在使用以下代码来调用上述 DIV #lightGallery

的 JS 函数

 $("#lightGallery").lightGallery({
    thumbnail: false,
});

我需要修改 JS 代码来为任何#DIV+num 调用函数，比如#lightGallery1、#lightGallery2、...等等

Answer 1

$('[id^="lightGallery"]').lightGallery({
    thumbnail: false,
});

Answer 2

取而代之，我会简单地给元素一个 class 名称并用

调用所有元素

$('.lightGallery').lightGallery({
    thumbnail: false,
});

Answer 3

最简单的，使用 attribute-starts-with 选择器 id:

$("[id^=lightGallery]").lightGallery({
    thumbnail: false,
});

如果需要过滤掉其他id以lightGallery开头但后面跟非数字字符的元素，也可以使用filter():

$("[id^=lightGallery]").filter(function(){
    return /^lightGallery\d+/.test(this.id);
}).lightGallery({
    thumbnail: false,
});

参考文献：

• CSS:
  • Attribute-starts-with ([attribute^=value]) selector.
• JavaScript:
  • JavaScript Regular Expressions.
  • RegExp.prototype.test().
• jQuery:
  • filter().