2012-07-05 16 views
6

Mam ten kod HTML:add klasa dla dzieci - jQuery

<div class="rotation"> 
    <ul> 
    <li><img src="..." alt="" /></li> 
    <li><img src="..." alt="" /></li> 
    <li><img src="..." alt="" /></li> 
    </ul> 
</div> 

muszę dodać klasę do ul, chcę zrobić to za pomocą jQuery, bo ul, li są generowane bez jakiejkolwiek klasy.
Powiedzmy, że tag ul musi być <ul class="image_rotation">. Jak mogę to zrobić?

Odpowiedz

11

Read about jQuery's addClass method here.

$('.rotation ul').addClass('image_rotation'); 

Powyższy kod doda klasę image_rotation każdej ul że jest potomkiem dowolnego elementu z klasą rotation.

Jeśli chcesz kierować tylko ul s, które stanowią natychmiastowe dziecko elementu z klasą rotation użyj child selector (>):

$('.rotation > ul').addClass('image_rotation'); 

Jeśli tylko chcesz to zrobić na jednej .rotation elementu powinieneś nadać mu identyfikator i wybrać go w ten sposób. Na przykład:

$('#rotation ul'); 

i

<div id="rotation" class="rotation"> 
    <ul> 
     <li><img src="..." alt="" /></li> 
     <li><img src="..." alt="" /></li> 
     <li><img src="..." alt="" /></li> 
    </ul> 
</div> 
+0

Jest lepiej niż Google. Napisałem moje pytanie i po 30 sekundach otrzymałem odpowiedź. Wcześniej szukałem tego w Google przez co najmniej 10 minut. Bardzo dobra odpowiedź. – miszczu

+0

@miszczu Dziękuję i tak, ta strona jest niesamowicie pomocna. Przyjazna wskazówka: bądź ostrożny i zadawaj takie pytania. Możemy przegłosować lub obniżyć twoje pytanie w zależności od tego, ile wysiłku badawczego włożyłeś i jak jasne jest to pytanie. To pytanie jest bardzo jasne, ale widziałem wcześniej, że dostałeś awans (wygląda na to, że wróciłeś teraz do 0). Stało się tak prawdopodobnie dlatego, że nie robiłeś żadnych wysiłków badawczych. Pamiętaj, aby pokazać, co wypróbowałeś do tej pory i jaką dokumentację obejrzałeś. Czasami, po zrobieniu tego, możesz odpowiedzieć sobie na pytanie! Pozdrawiam – lbstr

1
$(".rotation").children("ul").addClass("MyClass"); 
+0

'children' ma małą literę c i brakuje ci' $ 'lub' jQuery' przed '(" .rotation ")' – lbstr

+0

@lbstr - yes updated thanks for poiting that .. –

2

Jest to dość proste, wystarczy zrobić:

$(document).ready(function(){ 
    $('div.rotation ul').addClass('image_rotation'); 
}); 
6

bym sugerują utrzymanie go prosta:

$('div.rotation ul').addClass('image_rotation'); 

Albo, jeśli masz wiele ul elementy wewnątrz elementu div.rotation można określić pierwszą ul:

$('div.rotation ul:first').addClass('image_rotation'); 

Ostatnio ul:

$('div.rotation ul:last').addClass('image_rotation'); 

Albo ul indeksu od zera arbitray, na przykład trzeci ul (z indeksem 2):

$('div.rotation ul:eq(2)').addClass('image_rotation'); 

czyli

$('div.rotation ul').eq(2).addClass('image_rotation'); 

lub bezpośredniego dziecko (więc nie ul elementy zagnieżdżone w innych elementów)

$('div.rotation > ul').addClass('image_rotation'); 

Odniesienia:

3

Wszystko czego potrzebujesz to znaleźć UL w dziale i przypisać mu swoją klasę. można zobaczyć go w tym demo, ale kod HTML jest poniżej

$(document).ready(function(){ 
    $('ul','div.rotation').each(function(index){ 
     $(this).addClass('image_rotation'); 
    }); 
});​ 
2
$(".rotation ul").attr("class","image_rotation"); 
Powiązane problemy