sélecteurs jQuery de pair/impair nombre de lignes dans une table

Le code dans le premier Bloc de Code est le code source. Après le code source est en cours d'exécution. Le code sera modifié (Voir le 2ème Bloc de Code).

Je veux la classe(c'est à dire "même" et "étrange") de tag est affiché dans la "table1". Toutefois, actuellement, un nid de table (c'est à dire 'table2') a également "même" et "étrange" de la classe de chaque balise.

Quelqu'un peut-il m'aider? Merci à l'avance.

-----------Premier Bloc De Code--------------

<head>
<script type="text/javascript">
            $(document).ready(function(){
                $("#table1 tr:odd").addClass("odd");
                $("#table1 tr:not(.odd)").addClass("even");  
            });
</script>
</head>

<body>

<table id="table1">
    <tr>
        <td>AAA</td>
        <td>CCC</td>
    </tr>
    <tr>
        <td>BBB</td>
        <td>DDD</td>
    </tr>
    <tr>
        <td>
            <table id="table2">
                   <tr></tr>
                   <tr></tr>
            <table>
        </td>
    </tr>

</table>
</body>

-----------2e Bloc de Code---------------

<table id="table1">
    <tr class="even">
        <td>AAA</td>
        <td>CCC</td>
    </tr>
    <tr class="odd">
        <td>BBB</td>
        <td>DDD</td>
    </tr>
    <tr class="even">
        <td>
            <table id="table2">
                   <tr class="even"></tr>
                   <tr class="odd"></tr>
            <table>
        </td>
    </tr>

</table>

Vous devriez donner à votre question de façon plus significative titre.

InformationsquelleAutor Acubi | 2011-07-12

jquery jquery-selectors

Toutes les posté de réponse sont presque droit..

$(document).ready(function(){
    $("#table1 > tbody > tr:odd").addClass("odd");
    $("#table1 > tbody > tr:not(.odd)").addClass("even");  
});

De nombreux navigateurs automatiquement ajouter un tbody à votre table, même si vous n'ajoutez pas un vous-même. Donc #table1 > tr ne correspondra pas parce que tr n'est pas un enfant direct de table. Votre meilleur pari est d'utiliser le ci-dessus et ajouter explicitement une tbody pour les navigateurs qui ne le font pas pour vous.

 <table id="table1">
      <tbody>
        <tr class="even">
            <td>AAA</td>
            <td>CCC</td>
        </tr>
        <tr class="odd">
            <td>BBB</td>
            <td>DDD</td>
        </tr>
        <tr class="even">
            <td>
                <table id="table2">
                   <tbody>
                       <tr class="even"></tr>
                       <tr class="odd"></tr>
                   </tbody>
                <table>
            </td>
        </tr>
      <tbody>

</table>

http://jsfiddle.net/5ETAD/1/

InformationsquelleAutor James Montagne

1

Il devrait être:
```
$("#table1>tr:odd").addClass("odd");
$("#table1>tr:not(.odd)").addClass("even"); 
```
- Cela ne fonctionne pas: jsfiddle.net/5ETAD/2 testé sur chrome et IE8 et il correspond à rien. Les navigateurs en interne d'ajouter une tbody.
InformationsquelleAutor Chris Laplante

Vous pouvez utiliser les éléments suivants (notez le signe supérieur à):

       $(document).ready(function(){
            $("#table1 > tr:odd").addClass("odd");
            $("#table1 > tr:not(.odd)").addClass("even");  
        });

Cela permettra de sélectionner uniquement les enfants immédiats tr.

InformationsquelleAutor Sang Suantak

D'éviter toute redondance des DOM de la traversée, vous pouvez utiliser quelque chose comme ceci:

$('#table1 > tbody')
.filter('tr:odd').addClass('odd')
.end() //break chain and return to the original tbody element
.filter('tr:even').addClass('even')

InformationsquelleAutor Tudor Olariu

-1

Utiliser le enfant direct sélecteur.

Aussi, vous pouvez utiliser :même au lieu de :not(.impair)

$(document).ready(function(){                 
  $("#table1 > tr:odd").addClass("odd");                 
  $("#table1 > tr:even").addClass("even");               
});

InformationsquelleAutor Chandu

-1

            $("#table1 > tr:odd").addClass("odd");
            $("#table1 > tr:not(.odd)").addClass("even");

InformationsquelleAutor Neal

-1

Vous avez juste besoin d'utiliser de façon appropriée les sélecteurs CSS. Essayez:
```
$("#table1>tr:odd").addClass("odd");
```
InformationsquelleAutor Chris Pratt

Vous devez vous connecter pour publier un commentaire.