jQuery end() metódus

end()           A lekérdezett elemkészletre kiadott meghatározást követően, 
                              ugyan arra a lekérdezett elemkészletre, újabb meghatározás adhatunk ki.
							  
Értelmezhetnénk úgy is, hogy kettő az egyben. Egy lekérdezéshez, kettő egymástól eltérő meghatározást alkalmazhatunk.

Példa:
Lekérdezzük a p elemeket. Majd ezek közül kiválasztjuk, a class="p01" és class="p02" azonosítóval rendelkező p elemeket.
     - Egyforma feladatot határozhatunk meg, mindegyik kiválasztott elemnek.      $("p").find(".p01,.p03").[Csináld ezt.]
     - Első meghatározás végrehajtódik, de a második, nem.         $("p").find(".p01").[ Csináld ezt.].find(".p03").[Csináld azt.]
     - Mindkettő meghatározás végrehajtódik.              $("p").find(".p01").[ Csináld ezt.] .end() .find(".p03").[Csináld azt.]

Első teszt bemutató.

<script>
$(document).ready(function(){
    $("# find01 ").click(function(){
		$("ul.elso").find(".li01").css({"color": "black", "border": "3px solid red", "background-color": "orange"});
    });
// -----------------------------------------------------------------------------------------------------------
    $("#end01").click(function(){
		$("ul.elso").find(".li01").css({"color": "black", "border": "3px solid red", "background-color": "orange"})
		.end().find(".li03").css({"color": "black", "border": "3px solid green", "background-color": "orange"});
    });
// -----------------------------------------------------------------------------------------------------------
    $("#endZaras").click(function(){
		$("ul.elso").find(".li01").css({"color": "black", "border": "3px solid red", "background-color": "orange"})
		.end().css({"color": "black", "border": "3px solid green", "background-color": "greenyellow"});
    });
});
</script>

<li class="li01"> Első li, az első ul elemben 1 </li>
<li> li elem 2 span elem, a második li elemben</li>
<li class="li03"> Utolsó li, az első ul elemben 3 </li>

<li class="li01"> Első li, a második ul elemben 1 </li>
<li class="li02"> li elem 2 span elem, a második li elemben</li>
<li class="li03"> Utolsó li, a második ul elemben 3 </li>

Második teszt bemutató.

Első bekezdés.

Második bekezdés. span elem, a második bekezdésben strong elem, a második bekezdésben

<pre> Ez, pre elem.</pre>

Harmadik bekezdés. span elem, a harmadik bekezdésben van. Ez a span is, a harmadik bekezdésben van.

Negyedik bekezdés.

<pre> Ez, pre elem.<span> span, a pre elemben.</span></pre>

Hogyan működik. Jelölőelemek (címkék) lekérdezése:
jQuery objektumba tárolt címkék, $("p") kezdetben:
jQuery objektumba tárolt címkék, find("span") után:
jQuery objektumba tárolt címkék, end() után:

Kapott eredmények, a lekérdezett jelölőelemekről:
<samp></samp>
<samp></samp>
<samp></samp>

<script>
$(document).ready(function(){

    $("#find02").click(function(){
			$("p").find("span").css({"color": "black", "border": "3px solid green", "background-color": "greenyellow"});
    });
// ------------------------------------------------------------------------

    $("#end02").click(function(){
			$("p").find("span").end().css({"color": "black", "border": "3px solid red", "background-color": "orange"});
    });
// ------------------------------------------------------------------------

// ---- Kettő end() metódust határozunk meg, de, csak az első aktiválódik, a másodiknak nincs jelentősége.
    $("#end03").click(function(){
			$("p").find("span")
			.end().css({"color": "black", "border": "3px solid red", "font-size": "14px"})
			.end().css({"border": "3px solid green", "background-color": "orange"});
    });
// ------------------------------------------------------------------------

// ----------------- Hogyan működik? ---------------------------
    $("#end04").click(function(){
      // Létrehozunk egy függvényt, mely a funkció meghivásakor megadott paraméterek alapján, begyüjti elemeket a mappába.
      // Mappa tartalmát a get és join meghatározásokkal kiolvastatjuk, és a <samp> elemknél kiíratjuk.
        jQuery.fn.Informacio = function( n ) {
           var elemek = this.map(function() { return this.tagName;})  .get()  .join( ", " );
           $( "samp:eq( " + n + " )" ).text(elemek);    return this;
        };
			    // Kezdetben.
        $("p").Informacio( 0 )
		        // find("span") után.
        .find( "span" ).Informacio( 1 ).css({"color": "black", "border": "3px solid green", "background-color": "greenyellow"})
		        // end() után.
        .end().Informacio( 2 ).css({"color": "black", "border": "3px solid red", "background-color": "orange"})
		
    });
});