jQuery: Peki ya tüm çocuklar?

Question

Bazı jQuery işlevlerimde çok fazla .children() kullanmam gerektiğini hissediyorum.

$('.goal-small-container').hover(function() { 
    $(this).children('.goal-content').children('.goal-row').children('.goal-actions').css({visibility: "visible"}); 
}, function() { 
    $(this).children('.goal-content').children('.goal-row').children('.goal-actions').css({visibility: "hidden"}); 
}); 

daha iyi bir yolu var mı:

İşte benim HTML: benim jQuery burada

<div class="goal-small-container"> 
    <div class="goal-content"> 
    <div class="goal-row"> 
     <span class="goal-actions"> 

Ve değil mi? Bana çocukları söyle.

Answer 1

.find('.goal-content .goal-row .goal-action').whatever() 

veya daha basitçe:

.find('.goal-action').whatever() 

Answer 2

.find() hakkında duydunuz mu?

$('.goal-small-container').hover(function() { 
    $(this).find('.goal-actions').css({visibility: "visible"}); 
}, function() { 
    $(this).find('.goal-actions').css({visibility: "hidden"}); 
}); 

Answer 3

yerine

$(this).children('.goal-content').children('.goal-row').children('.goal-actions').css({visibility: "visible"}); 

Seni kullanabilirsiniz:

$(this).find('> .goal-content > .goal-row > .goal-actions').css({visibility: "visible"}); 

tam olarak aynı anlamı için. Bununla birlikte, belirsiz olma ihtimaliniz yoksa (.goal-actions sadece işaretlemenin yapısında görünecektir) sadece find('.goal-actions') kullanabilirsiniz.

Answer 4

Neden sadece .show kullanmayın() ve ikinci <div> üzerine .hide()? Ve başlangıçta onlara gizli veya bir şey göstersin.

Answer 5

sadece kullanabilirsiniz:

Aman Aman

$('.goal-small-container').hover(function() { 
    $(this).find('goal-actions').show(); 
}, function() { 
    $(this).find('goal-actions').hide(); 
});