javascript - CSS または JQuery の特定の画像拡張子セレクター

Question

プロジェクトには、いくつかの拡張子 (jpg、png、gif) を持つ複数の画像があります。

css または JQuery の拡張子に従ってこれらの画像を選択する方法はありますか。

<img src="img/img.jpg"/>
<img src="img/img1.png"/>
<img src="img/img2.gif"/>

たとえば、拡張子が .png の画像にheight: 200px;属性を持たせたいとします。

Answer 1

CSS3属性セレクターを使用することもできます。

img[src$='.png'] {
    height: 200px;
}

ブラウザのサポート

Chrome    Firefox               IE     Opera     Safari
All       1.0 (1.7 or earlier)  7      9         3

Answer 2

それらすべてを選択するには、次を使用する必要があります.filter()。

var images = $('img').filter(function() {
    return /\.(png|jpg|gif)$/.test(this.src);
}).height(200);