0

jqueryで「this」[現在のコンテキスト]を使用することについてはよくわかりません。私が知っていることは、domがすべての要素を検索するのを防ぎ、その現在の要素で動作するだけで、パフォーマンスが向上することです[もし私が私は間違っています]。また、いつこれを使用するのか、いつ使用しないのかわかりません。言いましょう、私は行くべきですか

  $("span",this).slice(5).css("display", "none")

また

 $("span").slice(5).css("display", "none")

どちらも機能しますが、実際にどのように機能するかについてはあまり明確ではありません。誰かが差分/適切な例で説明できますか?いつ何を使用するのですか? [編集]

      $(function() {
        $("#clickme").click(function() {
            $("span",this).slice(5).css('display', 'block');//doesn't work ? why?
             $("span").slice(5).css('display', 'block');//works..why?

        });
    });
enter code here <span id="clickme">Click me</span>
                 <span>itam1</sapn>
                <span>itam2</sapn>
                <span>itam3</sapn>
                 <span>itam4</sapn>
                    <span>itam5</sapn>
                    ...upto10
4

2 に答える 2

0

this通常、イベント ハンドラーでキーワードを使用できます。これは、イベントをトリガーした要素や などの他の jQuery 関数への参照になるため$.eachです。

たとえば、クリック イベントを処理する場合、次のように言います。

$('.parentElement').click(function () {
  $('.foo', this).hide();
});

上記のコードfooは、現在クリックされているクラスの子孫であるすべての要素を非表示parentElementにします。

jQuery 関数の context 引数を使用することは、findメソッドを呼び出すことと同じです。

$(expr, context);
// is just equivalent to:
$(content).find(expr);

編集:あなたの例を見て:

    $("#clickme").click(function() {
      $("span",this);//... (1)
      $("span");//..       (2)
    });

最初の行は、 (その子孫) の内部にあるすべてのspan要素を探します。これは、その要素がイベントをトリガーした要素であるためです。#clickmeclick

2 行目は、ページ全体のすべてのspan要素を探します。

于 2009-11-19T06:57:05.030 に答える
0

使い方

例としてこの HTML を使用してみましょう。

<div id="container">
   <div class="column"><a href="#">Link 1</a></div>
   <div class="column"><a href="#">Link 2</a></div>
</div>
<div id="footer">
   <a href="#">Link 3</a><a href="#">Link 3</a>
</div>

jQuery 関数のスコープ パラメーターは、DOM 要素または jQuery でラップされた要素セットへのキャッシュされた参照が既にある場合にのみ使用する必要があります。

var $set = $('#container');
$('a', $set).hide(); // Hides all 'a' tag descendants of #container

またはイベントで：

$("#container").click(function(e){
   $('a', this).hide(); // Same as call above
}

しかし、次のように使用しても意味がありません。

$('a', '#container').hide()

次のように記述する必要がある場合:

$('#container a').hide();

.find()とはいえ、jQuery または DOM 要素が既にある場合は、jQuery 関数で 2 番目のパラメーターを使用する代わりに、単純に使用する方が一般的に簡潔で明確です。私が示した最初の例は、代わりに次のように記述されます。

var $set = $('#container');
$set.find('a').hide(); // Hides all 'a' tag descendants of #container

この 1 つの呼び出しがオブジェクトを取得した唯一の理由である場合は、検索の範囲を要素#containerに限定するため、このように記述することもできます。#container

$("#container a").hide(); // This is the same as $('a', "#container");

選択範囲を絞り込む理由

jQuery がスコープなしのセレクターを探すとき、ドキュメント全体を検索します。セレクターの複雑さによっては、これには多くの検索が必要になる場合があります。探している要素が特定の親内でのみ発生することがわかっている場合は、選択範囲をその親に限定するためのコードが大幅に高速化されます。

選択するスコープの方法に関係なく、可能な限り常にセレクターのスコープを設定する必要があります。

于 2009-11-19T07:04:46.153 に答える