Főoldalra

jQuery addBack() és andSelf()

addBack()              Kiválasztott elemet, hozzáadja a lekérdezett csoporthoz.

andSelf()               Kiválasztott elemet, hozzáadja a lekérdezett csoporthoz. (Elavult.)

Kiválasztott elemmel kapcsolatban, DOM bejárás módszert hívjuk, lekérdezett elemek,  a verembe kerülnek.
Ha a kiválasztott elemre is szükség van, megtehetjük az addBack() segítségével.

Megjegyzés:
        Elfogadott az .addBack()  jQuery 1.8 és újabb verzióknál, ezt kell használni.
                       andSelf() jQuery verzió 1.2   Ez a funkció már elavult.

<p> addBack() és andSelf() nélkül.</p>

<div class="Teszt">
<h5> h5 elem </h5>

<p> p elem </p>

<p> p elem </p>

<pre> pre elem </pre>

<p> p elem </p>

</div>
<div>
    <ul>(indexe 0)
  • 1. <li> lista elem. (indexe 0) </li>
  • 2. <li>class="lielem02"> indexe=1</li>
  • 3. <li> lista elem. (indexe 2)
  • 4. <li> lista elem. (indexe 3)</li>
  • 5. <li> lista elem. (indexe 4)</li>
  • </ul>
</div>

<p> Kiértékelés addBack() alkamazással.</p>

<div class="Teszt">
<h5> h5 elem </h5>

<p> p elem </p>

<p> p elem </p>

<pre> pre elem </pre>

<p> p elem </p>

</div>
<div>
    <ul>(indexe 0)
  • 1. <li> lista elem. (indexe 0) </li>
  • 2. <li>class="lielem02"> indexe=1</li>
  • 3. <li> lista elem. (indexe 2)
  • 4. <li> lista elem. (indexe 3)</li>
  • 5. <li> lista elem. (indexe 4)</li>
  • </ul>
</div>

<p>Kiértékelés andSelf() alkamazással.</p>

<div class="Teszt">
<h5> h5 elem </h5>

<p> p elem </p>

<p> p elem </p>

<pre> pre elem </pre>

<p> p elem </p>

</div>
<div>
    <ul>(indexe 0)
  • 1. <li> lista elem. (indexe 0) </li>
  • 2. <li>class="lielem02"> indexe=1</li>
  • 3. <li> lista elem. (indexe 2)
  • 4. <li> lista elem. (indexe 3)</li>
  • 5. <li> lista elem. (indexe 4)</li>
  • </ul>
</div>
Normál lekérdezések.addBack() alkamazással.andSelf() alkamazással.






<head>
<script>
$(document).ready(function(){
// Kiválasztott: p --------------------------------------------------------------------------
     $("#no_addback01").click(function(){
         $( "div.Teszt" ).find( "p" ).css({"color": "black", "border": "3px solid red", "background-color": "orange"});
     });

// addBack() után, p ---------------------------
     $("#addback01").click(function(){
         $( "div.Teszt" ).find( "p" ).addBack().css({"color": "black", "border": "3px solid red", "background-color": "orange"});
     });
	
// andSelf() után, p ---------------------------
     $("#andSelf01").click(function(){
        $( "div.Teszt" ).find( "p" ).andSelf().css({"color": "black", "border": "3px solid red", "background-color": "orange"});
     });
// --------------------------------------------------------------------------------------------------------


// Kiválasztott: li --------------------------------------------------------------------------
    $("#no_addback02").click(function(){
			$( "li.elem02" ).nextAll().css( "background-color", "red" );
    });
// ------------------------------------------------------------
    $("#addback02").click(function(){
			$( "li.elem02" ).nextAll().addBack().css( "background-color", "red" );
    });
// ------------------------------------------------------------
    $("#andSelf02").click(function(){
			$( "li.elem02" ).nextAll().andSelf().css( "background-color", "red" );
    });
// ------------------------------------------------------------------------------------------


// Kiválasztott: li --------------------------------------------------------------------------
    $("#no_addback03").click(function(){
	    $("li:eq(2)").nextAll().css({"color": "black", "border": "3px solid red", "background-color": "orange"});
    });
// ------------------------------------------------------------
    $("#addback03").click(function(){
	    $("li:eq(2)").nextAll().addBack().css({"color": "black", "border": "3px solid red", "background-color": "orange"});
    });
// ------------------------------------------------------------
    $("#andSelf03").click(function(){
	    $("li:eq(2)").nextAll().andSelf().css({"color": "black", "border": "3px solid red", "background-color": "orange"});
    });
	
});
</script>
</head>
<body>
        <div class="Teszt">
            <h5> h5 elem </h5>
            <p> p elem </p>
            <p> p elem </p>
            <pre> pre elem </pre>
            <p> p elem </p>
        </div>
			
        <div>
            <ul> 
                <li> lista elem. (indexe=0) </li>
                <li>class="lielem02"> lista elem. (indexe=1) </li>
                <li> lista elem. (indexe=2)
                <li> lista elem. (indexe=3) </li>
                <li> lista elem. (indexe=4) </li>
            </ul>
         </div>


<button id="no_addback01"> addBack() nélkül $( "div.Teszt" ) </button>
<button id="addback01"> addBack() alkamazással $( "div.Teszt" ) </button>
<button id="andSelf01"> andSelf() alkamazással $( "div.Teszt" )</button>

<button id="no_addback02"> addBack() nélkül $( "li.elem02" ) </button>
<button id="addback02"> addBack() alkamazással $( "li.elem02" ) </button>
<button id="andSelf02"> andSelf() alkamazással $( "li.elem02" ) </button>

<button id="no_addback03"> addBack() nélkül $("li:eq(2)") </button>
<button id="addback03"> addBack() alkamazással $("li:eq(2)") </button>
<button id="andSelf03"> andSelf() alkamazással $("li:eq(2)") </button>

</body>