ホームページ >ウェブフロントエンド >jsチュートリアル >JQuery の ID セレクターとクラス セレクターの違いと関係について詳しく説明します。
以下のエディターは、jquery id selector と class selector の違いについての決まり文句を提供します。編集者はこれがとても良いものだと思ったので、皆さんの参考として今から共有します。エディターに従って見てみましょう。例は次のとおりです。
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <link href="style.css" rel="external nofollow" rel="external nofollow" rel="stylesheet" type="text/css"/> <script type="text/javascript" src="jquery-2.1.4.js"></script> <script type="text/javascript" src="dams.js"> </script> </head> <body> <p class="box">hello</p> <p class="box">world</p> </body> </html> $(function(){ alert($('.box').size()); //返回2 });
size() メソッドは、
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <link href="style.css" rel="external nofollow" rel="external nofollow" rel="stylesheet" type="text/css"/> <script type="text/javascript" src="jquery-2.1.4.js"></script> <script type="text/javascript" src="dams.js"> </script> </head> <body> <p id="box">hello</p> <p id="box">world</p> </body> </html> $(function(){ alert($('#box').size()); //只能获得一个id=box的DOM对象,返回1 });
。
id は一意であり、同じ ID を持つ要素が複数ある場合でも、jquery セレクターはそのうちの 1 つしか取得できません。つまり、jquery で ID にアクションを設定したい場合、その ID はページ上に 1 回だけ表示できます。 CSS スタイルの場合、ページ内の id=box を使用してすべての DOM オブジェクトを選択できます:
#box { color: red; };jQuery セレクターは
CSS セレクター
と非常に似ていますが、機能が異なります:
CSS はelement 後から追加されたのは単一のスタイルですが、jquery が追加したのは actionbehavior です。
以上がJQuery の ID セレクターとクラス セレクターの違いと関係について詳しく説明します。の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。