[jQuery] Poruszanie się po drzewie DOM Opcje

[gebp]

Mam problem aby dostać się do odpowiedniego elementu ( w drzewie DOM) za pomocą jQuery (aby przypisać mu zdarzenie onclick) W javascript bym sobie poradził ale chcę się nauczyć chociaż trochę jQuery.

[HTML] pobierz, plaintext 
<table id="tab" cellspacing="0" border="1">
<tbody>
  <tr>
    <td> Chcę się dostać do tego elementu </td>
    <td> i tego </td>
    <td> i tego </td>
    <td> i tego </td>
    <td> i tego </td>
    <td> i tego </td>
  </tr>
  <tr>
    <td> Ale NIE tego</td>
    <td> i tego też nie</td>
    <td>ten także jest zabroniony</td>
    <td> i ten</td>
    <td>WYKLUCZONE</td>
    <td> rówież </td>
  </tr>
</tbody>
</table>
<br />
<button onclick="test('tab')">Test</button>
 
[HTML] pobierz, plaintext 

i skrypt (a raczej to co wymyśliłem ale nie działa)

[HTML] pobierz, plaintext 
<script type="text/javascript">
function test(idtab){
 
$('#'+idtab).first("tr").each( function (i, el) {	
   $(el).css("backgroundColor", "yellow");
   $(el).click( function () { 
     alert("to jest komórka nr "+i);}
   );
}); 
 
}
 
 
</script>
[HTML] pobierz, plaintext 

Dzięki za wszystkie podpowiedzi i wyjaśnienia.

P.S. Wiem że dziwnie (inaczej niż wzorzec jQuery) pisze funkcje jednak tak mi jest wygodniej.

[#luq]

Tylko musisz zważyć na to, że każda metoda zwraca obiekt jQuery. A więc:

[JAVASCRIPT] pobierz, plaintext 
$(...).find(...).first(...).children(...)
[JAVASCRIPT] pobierz, plaintext 

będzie wolniejsze jeśli to opisać selektorami.

Nie ma przeszkód żebyś napisał:

[JAVASCRIPT] pobierz, plaintext 
$("#" + idtab + " tr:first td").each(...);
[JAVASCRIPT] pobierz, plaintext 

i właśnie w ten sposób powinieneś to zrobić.

[zegarek84]

Tylko musisz zważyć na to, że każda metoda zwraca obiekt jQuery. A więc:

[JAVASCRIPT] pobierz, plaintext 
$(...).find(...).first(...).children(...)
[JAVASCRIPT] pobierz, plaintext 

będzie wolniejsze jeśli to opisać selektorami.

Nie ma przeszkód żebyś napisał:

[JAVASCRIPT] pobierz, plaintext 
$("#" + idtab + " tr:first td").each(...);
[JAVASCRIPT] pobierz, plaintext 

i właśnie w ten sposób powinieneś to zrobić.

może inaczej (IMG:style_emoticons/default/winksmiley.jpg) - bardziej elegancko to wygląda (IMG:style_emoticons/default/winksmiley.jpg) - zacznę od tego, że druga metoda także opisuje dostęp przez selektory - tyle że css [też nie do końca gdyż first !== first-child] które muszą być prze parsowane zwłaszcza w starszych przeglądarkach... jQuery korzysta z Sizzle i nie każda przeglądarka w pełni obsługuje querySelector [czy jak się ta metoda zwie] - selektory muszą być przeparsowane i musza być wykonane odpowiednie metody po drodze jak getElementsByTagName... to pierwsze co krytykowałeś fakt zwraca obiekt jQuery, potem go modyfikuje lub zwraca nowy [zbyt dawno temu przeglądałem to by być pewny tego], ale większa część jQuery jest napisana na prototype - więc większość metod i własności jest zwracanych przez klonowanie a nie są tworzone od nowa... czasami "brzydszy" kod nie musi być wolniejszy - testy i jeszcze raz testy i to na kilku przeglądarkach - najlepiej skrajne na IE i wkurzającym także google chrome ;] [gdzie chyba wycinając niektóre flaki uzyskali taką szybkość a potem się męcz...]...

ps. wiem - teraz wspomnę o IE - ale też o jQuery... jak mnie poproszono bym rozwiązał problem z IE [którego nie mam na laptopie to musiałem to zrobić na innym kompie] to okazało się, że choć wszystko napisane przez jQuery [nie licząc innych błędów po drodze dla IE] to nie ma tam także zdarzenia 'input' dla IE - to po co wogóle ono tam było jak to nie problem dopisać "piaskownicę" na zdarzenie...

ja wiem o tym:

In older, pre-HTML5 browsers, "keyup" is definitely what you're looking for.

In HTML5 there is a new event, "input", which behaves exactly like you seem to think "change" should have behaved - in that it fires as soon as a key is pressed to enter information into a form.

Kod

$('element').bind('input',function);

ale szukaj wiatru w polu jak nie ma się IE ^^

a i children też mi się posypało - a myślałem, że większość rzeczy przemyśleli - a nie zrobili kluczowej [nie wiem jak teraz] - nie przekazali dzieci do "normalnej" tablicy jak to nawet w większości podstawowych tutoriali js jest wspomniane gdy bardziej skomplikowane operacje an dzieciach chcemy zrobić...

Ten post edytował zegarek84 11.01.2011, 00:40:38