jQuery .not()と:not()の色々な使い方

この記事は5年前に書かれました。不適当な記述を含む場合がありますので、参考程度に留めてください。

どうもこんばんは!

jQueryの中でも結構便利なのが
特定の要素以外を操作できる.notや:notです。

今回はそのマトメとして基本的な使い方~便利な使い方までを記しておきます。

指定した最初の要素以外



$(‘#ex1 ul li:not(:first)’).css({‘opacity’:’0.2′});
$(‘#ex4 ul li’).not(‘:first’).css({‘opacity’:’0.2′});

兄弟関係にある指定した最初の要素以外



$(‘#ex2 ul li:not(:nth-child(3n-2))’).css({‘opacity’:’0.2′});
[/html]
<h4 class="hand3">特定のclassを含んだもの以外</h4>
<img src="https://zxcvbnmnbvcxz.com/wp/wp-content/uploads/2012/04/se4.jpg">
[js]
$(‘#ex5 ul li’).not(‘.typeA,.typeB,.typeC’).css({‘opacity’:’0.2′});

アニメーションしている要素以外


$("ul li").hover(function () {
$(this).not(":animated").animate({"opacity":"1"},"slow");},
function () {
$(this).animate({"opacity":"0.5"},"slow");
});

DEMO

以上です。