it-swarm-ja.tech

.end()関数はjQueryで何をしますか?

私はすでにこのWebページを読んでいます http://api.jquery.com/end/ ですが、.end()が実際に何をするのかまだわかりません。それは何のためにあり、どのように使用しますか?

私もjQueryの本を読んでいますが、.end()を軽く釉薬で覆っており、その目的の例は示されていません。誰かが明確にすることができますか?

38
Luke101
_$("body").find("span").css("border", "2px red solid");
_

vs

_$("body").find("span").end().css("border", "2px red solid");
_

この正確なページのFirebugコンソールでこれらのステートメントを個別に実行し、動作の違いに注意してください。基本的に、.end()は、すべてのスパンを見つけた後にボディに戻り、スパンではなくボディに境界線を適用するように指示します。そこに.end()がない場合、jQueryコードは基本的に正常に動作し、本体内のspan要素に.css()を適用します。

_BODY > SPAN > APPLY BORDER TO SPANS
_

end()

_BODY > SPAN > GO BACK TO BODY > APPLY BORDER TO BODY
_

find()は破壊的な操作です。つまり、jqueryオブジェクト配列内の要素を変更します。

_$('body') 
_

私たちの現在の要素は体です

_$('body').find('span') 
_

破壊的な操作find()を使用しました。これにより、オブジェクトコレクション全体が変更され、ボディ内にスパンが入力されます。ボディはコレクションに含まれなくなります。

_$('body').find('span').end() 
_

findは「破壊的な」操作であるため、.find()を実行する前に戻ります。基本的には、元に戻すか、ctrl-Zがjqueryコレクションを変更した最後の操作です。

64
meder omuraliev

基本的には親セットに戻ります。例えば:

$('.tree')
    .find('.branch')
        .find('.leaf')
        .addClass('tacks-onto-leaf')
        .end()
    .addClass('tacks-onto-branch')
    .end()
.addClass('tacks-onto-tree');
52
Nick Jurista

チェーンされたJQueryステートメントの「スコープ」を前のレベルに戻します。

JQueryオブジェクトの最初のタグ[$( 'P')]:P、P

検索後のjQueryオブジェクトのタグ[$( 'P')。find( 'SPAN')]:SPAN、SPAN、SPAN、SPAN、SPAN

終了後のjQueryオブジェクトのタグ[$( 'P')。find( 'SPAN')。end()]:P、P

$('span')              //all <span> tags in the doc
  .find('#foo')          //all <span> with id foo
    .addClass('blinkyRed') //adds class blinkyRed <span id='foo'> 
  .end()                 //reverts scope to all <span> tags
.addClass('Bold')      //adds class Bold to all <span> tags
7
Skeolan

これにより、現在の「スコープ」を終了して再定義できます。たとえば、次のようなHTMLがあるとします。

<div id="people">
 <ul>
   <li>A</li>
   <li>B</li>
 </ul>
 <ul>
   <li>C</li>
   <li>D</li>
  </ul>
</div>

最初に次の方法で親を選択できます。

$('#people')

そして、次のような子ul要素を変更します

#('#people').find('ul').css('border', '1px solid #f00')

しかし、親要素(#people)の編集を続けたい場合はどうなりますか?新しいFinder $( '#people')を開始するか、最初の行にチェーンして、その前に.end()を付けて、find()を「閉じ」、検索範囲をに戻すことをjQueryに通知することができます。先行する検索(暗黙的に$( '#people')、そのように)

#('#people').find('ul').css('border', '1px solid #f00').end().css('border', '1px dashed #00f')

したがって、その行は次のようになります。#peopleのすべての子ULを取得し、それらの境界線を赤に変更してから、親#people要素の境界線を破線と青に変更します。

4
Cody Caughlan

次の関数を使用して、jQueryの選択を変更できます。通常は、選択をより具体的にするか、包括的/排他的にします。

add、andSelf、children、filter、find、map、next、nextAll、not、parent、parents、prev、prevAll、siblings、slice、clone、appendTo、prependTo、insertBefore、insertAfter、またはreplaceAll

.end()を使用すると、拡張選択を操作した後、選択を元の要素のセットにリセットできます。

0
JGarrido