javascript добавить класс к следующим 7 элементам

Question

Мне было интересно, как добавить класс в следующие 7 элементов родителя с помощью javascript? Я хочу, чтобы выделить следующие шесть элементов после выбора

<table> 
    <tr> 
    <td>list item 1</td> 
    <td>list item 2</td> 
    <td>list item 3</td> 
    <td>list item 4</td> 
    <td>list item 5</td> 
    </tr> 
    <tr> 
    <td>list item 6</td> 
    <td>list item 7</td> 
    <td>list item 8</td> 
    <td>list item 9</td> 
    <td>list item 10</td> 
    </tr> 
    </table> 

Я прочитал о: эк,: ЛТ (индекс) селекторов, но он не работает. Спасибо заранее.

Answer 1

Вы можете использовать :lt селектор, который будет выбирать соответствующие элементы с индексом меньше заданного числа (индекс начинается с 0)

В этом примере, 0-6td элементы будут выбраны. В случае, если вы хотите, чтобы отметить начальный индекс, используйте :gt с индексом запуска

Попробуйте это:

$('table td:lt(7):gt(2)').css('color', 'red');

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script> 
 
<table> 
 
    <tr> 
 
    <td>list item 1</td> 
 
    <td>list item 2</td> 
 
    <td>list item 3</td> 
 
    <td>list item 4</td> 
 
    <td>list item 5</td> 
 
    </tr> 
 
    <tr> 
 
    <td>list item 6</td> 
 
    <td>list item 7</td> 
 
    <td>list item 8</td> 
 
    <td>list item 9</td> 
 
    <td>list item 10</td> 
 
    </tr> 
 
</table>

Примечание: Если объединить lt и gt то он будет работать в котором они указаны. В приведенном выше примере селектор выберет td элементов меньше индекса 7, а затем отфильтрует их с индексом больше 2