jquery の基本的なセレクター
1. jquery のセレクターは基本的に CSS のセレクターと同じなので、CSS に精通している開発者は簡単に習得できます
2. ほとんどの CSS セレクターは jquery で直接使用できます
。 3. 基本セレクター。基本セレクター、またはエントリー セレクター、単純セレクターとも呼ばれます。その機能は、後続のフィルターが動作するための第 1 レベルの要素を jquery に提供することです。タグ、id、クラス、*
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>基本选择器</title> <style type="text/css"> table, td { border:1px solid #333; } table { border-collapse: collapse; margin: 30px auto; width: 80%; text-align: center; } table caption { font-size: 1.5em; margin-bottom: 15px; } .bg-orange { font-weight: bolder; color: white; background-color: orange; } </style> </head> <body> <table> <caption>用户信息表</caption> <tr id="title"> <td>01</td> <td>02</td> <td>03</td> <td>04</td> <td>05</td> <td>06</td> <td>07</td> <td>08</td> <td>09</td> <td>10</td> </tr> <tr> <td>01</td> <td>02</td> <td>03</td> <td>04</td> <td>05</td> <td>06</td> <td>07</td> <td>08</td> <td>09</td> <td>10</td> </tr> <tr> <td>01</td> <td>02</td> <td>03</td> <td>04</td> <td>05</td> <td>06</td> <td>07</td> <td>08</td> <td>09</td> <td>10</td> </tr> <tr> <td>01</td> <td>02</td> <td>03</td> <td>04</td> <td>05</td> <td>06</td> <td>07</td> <td>08</td> <td>09</td> <td>10</td> </tr> <tr> <td>01</td> <td>02</td> <td>03</td> <td>04</td> <td>05</td> <td>06</td> <td>07</td> <td>08</td> <td>09</td> <td>10</td> </tr> <tr> <td>01</td> <td>02</td> <td>03</td> <td>04</td> <td>05</td> <td>06</td> <td>07</td> <td>08</td> <td>09</td> <td>10</td> </tr> <tr> <td>01</td> <td>02</td> <td>03</td> <td>04</td> <td>05</td> <td>06</td> <td>07</td> <td>08</td> <td>09</td> <td>10</td> </tr> <tr> <td>01</td> <td>02</td> <td>03</td> <td>04</td> <td>05</td> <td>06</td> <td>07</td> <td>08</td> <td>09</td> <td>10</td> </tr> <tr> <td>01</td> <td>02</td> <td>03</td> <td>04</td> <td>05</td> <td>06</td> <td>07</td> <td>08</td> <td>09</td> <td>10</td> </tr> <tr> <td>01</td> <td>02</td> <td>03</td> <td>04</td> <td>05</td> <td>06</td> <td>07</td> <td>08</td> <td>09</td> <td>10</td> </tr> </table> </body> </html> <script type="text/javascript" src="../js/jquery-3.3.1.js"></script> <script type="text/javascript"> //1. tag标签选择器 // $('td').css('backgroundColor','wheat') //2.id选择器 //把td上的背景去掉,否则会层叠覆盖 $('#title').css('backgroundColor','lightgreen') //3.class类选择器 $('.mark').addClass('bg-orange') //4.*通配选择符 $('tr:nth-child(3) ~ *').css('backgroundColor', 'pink') </script>
以上がjQueryの基本的なセレクターの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。