<div class="codetitle"> <span><a style="CURSOR: pointer" data="34014" class="copybut" id="copybut34014" onclick="doCopy('code34014')"><u>コードをコピー</u></a></span> コードは次のとおりです:</div> <div class="codebody" id="code34014"> <br>1. データの準備<br><table id="table1"> <br><tr><th>記事タイトル</th><th>記事カテゴリ</th> <th>リリース時間</th> <th>操作<br> </th> <tr> <td>テスト</td> <td>テスト </td> <td>テスト</td> <td>テスト<br> </td> </tr> <tr> <td>テスト</td> <td> ;テスト</td> <br> td>テスト<td>テスト<br> </td> </tr> <tr> <td>テスト</td> <td>テスト</td> <td>テスト</td><td>テスト</td></tr> <br></table> <br><tr><td> ;記事タイトル</td><td>記事カテゴリ</td><td>公開時刻</td><td>操作</td></tr><br><tr>< ;td>テスト</td><BR><tr><td>テスト<BR><BR><BR><BR> ;テスト</td><td>テスト</td>gt;<td>テスト</td><td>テスト</td></tr> ;<td>テスト</td>< /tr> <br></table> <br><thead> <br></thead< tbody><BR><tr><td>テスト</td><td>テスト<td>gt;テスト</td> ;<td>テスト</td></tr> <BR><tr><td>テスト</td><td>テスト</td><td>テスト</td></tr> /td><td>テスト</td></tbody> <br></table> <br> ;td><br><tr><td>記事タイトル</td><td>記事カテゴリ</td><td>操作</td> ;/tr><br><br> </td> <td></td> <td>テスト<br> </td> <td>テスト<br> </td> <td>テスト<br> </td> </tr> <tr>テスト<br><br> ;<td>テスト</td><td>テスト</td><td>テスト</td><td>テスト</td></tr><br><tr>< ;td>テスト 3<td>テスト</td> <td>テスト</td>テスト<br><br></table> <br>2. 操作<br><script type="text/javascript"> <br>//1. マウスを動かすと行の色が変わります<br> table1 tr").hover(function(){ <br>$(this).children("td").addClass("hover") <br>},function(){ <br>$(this).children ("td").removeClass("hover" ) <br>}) <br>$("#table2 tr:gt(0)").hover(function() { <br>$(this).children( "td").addClass("hover") ; <br>}, function() { <br>$(this).children("td").removeClass("hover");); <br>//2. 奇数行と偶数行で異なる色<br>$("#table3 tbody tr:odd").css("background-color", "#bbf"); "#table3 tbody tr:even").css("背景色","#ffc"); <br>$("#table3 tbody tr:odd").addClass("odd") <br>$( "#table3 tbody tr:even").addClass("even") <br>//3. 行を非表示にする<br>$("#table3 tbody tr:eq(3)").hide(); >//4 .列を非表示にする<br>$("#table5 tr td::nth-child(3)").hide(); <br>$("#table5 tr").each(function() {$("td :eq(3)",this).hide()}); <br>//5. 1 行を削除<br>// 最初の行を除くすべての行を削除<br>$("# table6 tr:not (:first)").remove(); <br>//6. 列を削除 <br>// 最初の列を除くすべての列を削除 <br>$("#table6 tr td:not( :nth- child(1))").remove(); <br>//7. 特定のセルの値を取得 (設定) <br>//table7 の値、2 番目の tr の最初の td を設定。 <br>$("#table7 tr:eq(1) td:nth-child(1)").html("value"); <br>//table7、2 番目の tr 値の最初の td を取得します。 <br>$("#table7 tr:eq(1) td:nth-child(1)").html(); <br>///8. 行を挿入します: <br>//2 番目の tr の後に行を挿入<br>$("</tr> <tr>gt;<td>insert 3</td>gt;<td>insert</td>gt;<td>insert</td> <td>insert td> </tr>").insertAfter($("#table7 tr:eq(1)")); <br></script> <br><br> </td> </tr> </div>
![[Web フロントエンド] Node.js クイック スタート](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
