javascriptの 'this'キーワード

Question

複数の.packagesクラスを持っている場合、現在の.packagesの実装方法

$('.packages').each(function(){ 
    var sizeOfLi = $(".packages:last > li").width(); 
}); 

Answer 1

var sizeOfAllLi = $(".packages:last > li").map(function() { 
    return $(this).width(); 
}); 

jQueryのコレクションに対するmap関数の繰り返し処理を行い、現在の要素にthisセットと、引数に設けられた関数を呼び出します。 の戻り値をすべて配列 のjQueryコレクション（コメントを参照）に集めます。配列が必要な場合は、上記の末尾に.get()を追加します。関数の内部

、thisは裸のDOM要素であるため、私たちは、jQueryの.width()を使用できるようにjQueryの要素として再ラップthisする必要があります。

Answer 2

これは、関数のメインセレクタであるjQueryのイベントハンドラに常に適用されます。

Answer 3

$(".packages:last > li").each(function() { 
    console.log($(this).width()) 
}); 

Answer 4

each答えは大丈夫ですか、mapを使用することができます。

var liSizeArray = $(".packages:last > li").map(function() { 
    return $(this).width(); 
}).get(); 

戻り値は数値の配列、それぞれのli要素の幅になります。あなたが選択したときliの幅を取得したい場合

Answer 5

あなたは

を何をしたいかによって異なります。Amadanは

var sizeOfAllLi = $(".packages:last > li").map(function() { return $(this).width(); }) 

を言ったように

$(".packages:last > li").click(function(){ 
    sizeOfLi = $(this).width(); 
}); 

マップすべてのliサイズが行いますthisキーワードは、この場合の最新のLiを指します。