Czy jest to błąd w sposobie, w jaki jQuery traktuje selektory podrzędne?

Question

Czy jest jakiś błąd w tym, w jaki sposób jQuery obsługuje selektory podrzędne lub czy brakuje mi czegoś oczywistego? Nie mogę go uruchomić, gdy dziecko jest czymś innym niż *.

Oto selektor jQuery Używam:

$("#myTable > tr").each(function() { 
    // do somthing } 
); 

a struktura tabeli jest:

<table id="myTable"> 
    <tr> 
     <td><button>someButton</button></td> 
     <td><textarea>...</textarea></td> 
    </tr> 
</table> 

żadne elementy są dopasowane do powyżej selektora #myTable > tr. Ale dwa selektory wymienione poniżej działają dobrze.

$("#myTable tr") // search all descendants for tr 

lub użyć symbolu wieloznacznego, aby dopasować dzieci:

$("#myTable > *") // search all child elements 

jakieś pomysły na to, co może być nie tak tutaj?

Dzięki za szybkie odpowiedzi chłopaki! Niestety może wybrać tylko jeden.

Answer 1

To dlatego, że Firefox automatycznie dodaje elementy tbody wokół elementów tr, jeśli żadne z nich nie są dostarczane. Naprawdę nie możesz użyć table > tr.

Masz:

<table id="myTable"> 
    <tr> 
     <td><button>someButton</button></td> 
     <td><textarea>...</textarea></td> 
    </tr> 
</table> 

Ale Firefox widzi to:

<table id="myTable"> 
    <tbody> 
    <tr> 
     <td><button>someButton</button></td> 
     <td><textarea>...</textarea></td> 
    </tr> 
    </tbody> 
</table> 

Inne elementy będą działać dobrze:

<div> 
    <strong>Hi</strong> 
</div> 

a selektora:

alert($("div > strong").text()); // Alerts "Hi" 

Answer 2

Jest niejawna <tbody> elementem dodał czyli zamiast:

<table id="myTable"> 
    <tr> 
    <td><button>someButton</button></td> 
    <td><textarea>...</textarea></td> 
    </tr> 
</table> 

DOM faktycznie zawiera:

<table id="myTable"> 
<tbody> 
    <tr> 
    <td><button>someButton</button></td> 
    <td><textarea>...</textarea></td> 
    </tr> 
</tbody> 
</table> 

więc go zmienić na:

$("#mytable > tbody > tr"); 

Korzystanie <tbody>, <thead> i <tfoot> Elementy w twoich stolikach to dobry nawyk, by się dostać.

Answer 3

Tak, Doug ma zupełną rację. Tylko w celu uzupełnienia odpowiedzi, być może jesteś świadomy, a może nie, ale pamiętaj, że jQuery przemierza DOM, a nie "tekst" HTML, który wysyłasz do przeglądarki.

DOM to interpretacja przeglądarki w kodzie HTML, który zostanie wysłany.