javascript - 通过 JavaScript 选择页面中的所有 gif

Question

我需要创建一个包含所有 <img> 的列表我页面中的元素是 gif(而不是 jpeg、png 等)。现在我是这样做的:

var imgs = Array.prototype.slice.call( document.getElementsByTagName('img') );
imgs = imgs.filter(function(img){ return img.src.endsWith(".gif") })

是否有使用纯 JavaScript 的更短的替代方案？

Answer 1

您可以使用 querySelectorAll()与 attribute value ends with selector

var allGifs = document.querySelectorAll('img[src$=".gif"]');

querySelectorAll 返回一个集合，所以如果你想要一个数组，你仍然需要 Array.prototype.slice 技巧或 Array.from(ES2015，但可调整)等。(此外，它返回的集合不像 getElementsByTagName 返回的集合那样“实时”。)

---

相同的选择器可以与 jQuery 一起使用。^{添加以供 jQuery 人员引用}

$('img[src$=".gif"]')