jQuery: находит четные строки таблицы, соответствующие первой, третьей и т. д.
jQuery Fundamental - II: Упражнение-88
Находит четные строки таблицы, соответствующие первой, третьей и т. Д. (Индекс 0, 2, 4 и т. Д.)
<Тело> <table border = "1"> <tr> <td> R1C1 Index-0 </ td> <td> R1C2 Index-0 </ td> </ tr> <tr> <td> R2C1 Index-0 </ td> <td> R2C2 Index-1 </ td> </ tr> <tr> <td> R3C1 Index-0 </ td> <td> R3C2 Index-2 </ td> </ tr> <tr> <td> R4C1 Index-0 </ td> <td> R4C2 Index-3 </ td> </ tr> <tr> <td> R5C1 Index-0 </ td> <td> R5C2 Index-4 </ td> </ tr> л; / таблица> <button id = "button1"> Нажмите, чтобы увидеть эффект </ button> </ Body>
Пример решения:
HTML-код:
<!DOCTYPE html>
<html>
<head>
<script src="https://code.jquery.com/jquery-git.js"></script>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>Finds even table rows, matching the first, third and so on.</title>
<style type="text/css">
button {
display: block;
margin: 20px 0 0 0;
}
</style>
</head>
<body>
<table border="1">
<tr><td>R1C1 Index-0</td><td>R1C2 Index-0</td></tr>
<tr><td>R2C1 Index-0</td><td>R2C2 Index-1</td></tr>
<tr><td>R3C1 Index-0</td><td>R3C2 Index-2</td></tr>
<tr><td>R4C1 Index-0</td><td>R4C2 Index-3</td></tr>
<tr><td>R5C1 Index-0</td><td>R5C2 Index-4</td></tr>
</table>
<button id="button1">Click to see the effect</button>
</body>
</html>
Код JavaScript:
$('#button1').click(function(){
$( "tr:even" ).css( "background-color", "orange" );
});
См. Pen jquery- ОСНОВНОЕ УПРАВЛЕНИЕ -88 от w3resource ( @ w3resource ) на CodePen .
Внесите свой код и комментарии через Disqus.
Предыдущий: Найдите шестую ячейку (второй ряд и третий столбец) таблицы 3х3.
Далее: проверьте, была ли нажата клавиша META при возникновении события.
Каков уровень сложности этого упражнения?
Новый контент: Composer: менеджер зависимостей для PHP , R программирования
disqus2code