Wählen Sie das erste Kind, die Kinder mit Jquery

Ich habe eine html-Struktur wie diese:

<div class="one">
  <div id="two">
    <h2>Any</h2>
    <h4>Any</h4>
  </div>
  <div id="three">
  </div>
</div>

Habe ich zum auswählen der ersten und die ersten die Kinder von Elementen im obigen Fall: #zwei, h2, h4, ohne zu wissen, das erste element den id-Namen.
Wie könnte ich das tun?

Kann ich wählen Sie das erste element, aber wenn ich Inhalte hinzufügen().find (), um div:Erstens kann ich nicht wählen, seine Kinder:

$(document).ready(function() {
    $(".one").mouseover(function () {  
        $(this).children('div:first').contents().find('h2,h4').stop(true, true).fadeIn('fast');
     });

    $(".one").mouseout(function () { 
        $(this).children('div:first').contents().find('h2,h4').stop(true, true).fadeOut('fast');
    });
});

Den letzten und arbeiten (kein flimmern!) code:

$(".one").hover(function () {  
$(this).children('div:first').stop(true, true).fadeIn('fast');
}, function() {;
$(this).children('div:first').stop(true, true).fadeOut('fast');
});

Ich denke, ich muss zu geben, mir selbst mehr Zeit zu denken, bevor Sie hierher kommen und Fragen zu stellen. Jedenfalls habe ich gelernt, über .andSelf() und ein bisschen Jquery-syntax. Nochmals vielen Dank.

InformationsquelleAutor elbatron | 2011-08-12

  1. 6

    Brauchen Sie nicht zu verwenden, sowohl find() und contents() - Versuchen Sie dies:

    $(document).ready(function() {
    $(".one").mouseover(function () {  
        $(this).children('div:first').children('h2,h4').stop(true, true).fadeIn('fast');
     });

    $(".one").mouseout(function () { 
        $(this).children('div:first').children('h2,h4').stop(true, true).fadeOut('fast');
    });
});

    Und wenn Sie müssen, halten Sie auch das "erste" element in der Knotenmenge, verwenden Sie .andSelf() nach dem zweiten .children() (als pro @Felix 's Antwort).

    Dies ist eigentlich ein wenig falsch, weil sein code war anfällig für Fehler. Er will einfach nur die Kinder und nicht die Nachkommen, so dass find('h2,h4') gibt die falschen Elemente.
    Tatsächlich, für das problem, das er hat, ist es egal. Nevermind.
    Das ist ein guter Punkt, aktualisieren meine Antwort.
    Danke Jungs, es scheint, dass ich habe nicht mit h2,h4, fadein/fadeout der div - mein ursprüngliches problem ist, dass die Maus über den verblichenen in h2-und h4-Elemente macht den div flimmern.
    Keine Sorge. Froh, Sie haben sortiert 🙂

    InformationsquelleAutor irama

  2. 3

    Können Sie Kinder [docs] und andSelf [docs]:

    $(".one").mouseover(function () {  
    $(this).children().first().children('h2, h4').andSelf()....
});

    Wenn Sie nicht möchten, fügen Sie dem ersten Kind (der Elternteil) den Satz weglassen andSelf. Deine Frage ist ein wenig vage in diesem Punkt. Aber ich nehme Sie eigentlich gar nicht möchten, wählen Sie das erste Kind, nur seine Kinder. Wenn Sie um ein element auszublenden, seine Kinder versteckt sind zu.

    So, die Sie anrufen möchten fadeOut auf die Kinder und das element selbst? Was ist der Zweck davon? Wenn Sie verstecken die Eltern die Kinder versteckt werden, auch.
    Danke. Eigentlich wollte ich markieren Sie das erste element und seine Kinder. Diese hatte ich bisher: '$(this).Kinder('div:first').stop(true, true).fadeOut('fast'); " und es macht das gleiche wie dein code oben mindestens das Ergebnis ist das gleiche... Es sieht aus wie es nur wählt das erste element, ohne seine Kinder:... obwohl das div fadein und out richtig schwebt über den h2-und h4-Elemente des div flackert... Weil das flackern, ich dachte, dass ich brauchen, um die das erste Element der Kinder als auch in der Jquery...
    Mmmh. Nun, jetzt wissen Sie zumindest, wie Sie können wählen, alle von Ihnen und Sie können spielen, um 😉
    Ja, vielen Dank. Gibt es eine andere Möglichkeit zu verhindern, dass die flackern? (Auswahl alle oder nur das erste Kind div-Ergebnis)

    InformationsquelleAutor Felix Kling

  3. 1

    :

      $(this).children('div:first').contents().find('h2,h4').stop(true, true).fadeIn('fast');

    :

      $(this).children('div:first').children('h2,h4').stop(true, true).fadeIn('fast');

    InformationsquelleAutor xandercoded

Schreibe einen Kommentar