Geben Sie Elternklasse, wenn keine untergeordneten Elemente mit Klassen

Question

sind

Ich habe eine Liste von Elementen und ich möchte eine Klasse zu dem übergeordneten Element tr geben, wenn das Kind darin keine Klasse zugewiesen hat. Ist das mit jQuery oder Vanille JS möglich?

<tr> 
<td class="unfoldedlabel" colspan="6"><a>Accessories</a></td> 
</tr> 

<tr> 
<td class="foldedlabel" colspan="6"><a>Accessories</a></td> 
</tr> 

<tr> 
<td><a>Accessories</a></td> 
</tr> 

Answer 1

Try this: Sie können die iterieren tr s und überprüfen, ob es Kind mit bestimmten Klasse hat und wenn nicht, dann Klasse hinzufügen.

$('tr').each(function(){ 
    if($(this).children('.childClass').length ==0) 
    $(this).addClass('parentClass'); 
}); 

Answer 2

können Sie verwenden, um die has() und not() Selektoren

$('tr').not(':has(td[class])').addClass('no');

tr.no { 
 
    color: red; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<table> 
 
    <tr> 
 
    <td class="unfoldedlabel" colspan="6"><a>Accessories</a> 
 
    </td> 
 
    </tr> 
 

 
    <tr> 
 
    <td class="foldedlabel" colspan="6"><a>Accessories</a> 
 
    </td> 
 
    </tr> 
 

 
    <tr> 
 
    <td><a>Accessories</a> 
 
    </td> 
 
    </tr> 
 
</table>

Answer 3

Sie können :has() und :not()

$('tr:has(>:not(td[class]))').addClass('class')

.class { 
 
    color: red 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
 
<table> 
 
    <tr> 
 
    <td class="unfoldedlabel" colspan="6"><a>Accessories</a> 
 
    </td> 
 
    </tr> 
 

 
    <tr> 
 
    <td class="foldedlabel" colspan="6"><a>Accessories</a> 
 
    </td> 
 
    </tr> 
 

 
    <tr> 
 
    <td><a>Accessories</a> 
 
    </td> 
 
    </tr> 
 
</table>