findメソッド
find('絞り込むセレクタ')
- 「jQueryオブジェクトに含まれる各要素の子孫要素の中から、セレクタを使用してさらに要素を絞り込むメソッド」
filterメソッド
find('絞り込むセレクタ')
- 「jQueryオブジェクトに含まれる各要素の子孫要素の中から、セレクタを使用してさらに要素を絞り込むメソッド」
findメソッドとfilterメソッドの違い
| find() |
jQueryオブジェクトの各要素の子孫要素を対象として要素を絞り込む |
| filter() |
jQueryオブジェクトの各要素を対象として要素を絞り込む |
要するに、CSSのセレクタでの例えでいうと
| findメソッド |
'div▲.text'と指定 |
| filterメソッド |
'div.text'と指定 |
※「▲」は半角スペースを意味します
eachメソッド
each(function(index){
要素ごとの処理
});
「jQueryオブジェクトに含まれる各要素に対して個別に処理を実行するメソッド」
indexに関して→「現在処理されている要素の番号(全要素のうち何番目の要素か)」
実例
$('#buttons2 button').each(function(index){
var pos = index * 40 - 40;
$(this).css('top', pos);
});
toggleClassメソッド
「引数に指定されたクラス名(文字列)が、jQueryオブジェクト内の要素の
class属性に指定されているのか場合は追加し、すでに指定されている場合は
削除するメソッド」
実例
var $asidebutton = $aside.find('button').on('click', function(){
$aside.toggleClass('open');
});
実行前
<aside class="open">
<!-- 内容は省略 -->
</aside>
実行後 openクラスが削除される
<aside>
<!-- 内容は省略 -->
</aside>
attrメソッド
attr()メソッド：属性値の取得(jQueryオブジェクトは返らない)
attr(属性名);
attr()メソッド：属性値の設定(jQueryオブジェクトは返らない)
attr(属性名, 値);
addClassメソッド(toggleClassメソッドの類似メソッド)
「引数の文字列(クラス名)をclass属性に追加するメソッド」
実例
$('#add').addClass('test')
実行前
<p id = "add" class="add">
<!-- 内容は省略 -->
</p>
実行後 testクラスが追加される
<p id = "add" class="add test">
<!-- 内容は省略 -->
</p>
removeClassメソッド(toggleClassメソッドの類似メソッド)
「引数の文字列(クラス名)をclass属性に削除するメソッド」
実例
$('#add').removeClass('test')
実行前
<p id = "add" class="add test">
<!-- 内容は省略 -->
</p>
実行後 testクラスが追加される
<p id = "add" class="add">
<!-- 内容は省略 -->
</p>