IDとクラスの違いですが、クラスとIDのどちらを使用すればよいのでしょうか?

前の 2 つの記事では、クラスと ID のそれぞれに関する関連知識と使用方法について説明しましたが、実際のプロジェクトでは、クラスと ID をどのように選択すればよいでしょうか?

最初に 2 つの違いを確認しましょう!

1. ID は一意であり、クラスはユニバーサルであるため、同じ ID はページ内で 1 回のみ使用できますが、クラスは制限なく使用できます。

2.id はクラスよりも優先されます。次のように:

1. #p1{color:red}

2. .p2{color:green}

3. < ;p id="p1" class="p2">これは段落です

5. 上記は例であり、p 要素のテキストは代わりに赤色になりますID がクラスよりも優先されるため、緑色になります。

実際、id と class の使用法は非常に簡単ですが、エレガントな CSS コードを書きたい場合は、いくつかの点に注意する必要があります。現在、私が取り組んでいるプロジェクトはアジャイル モデルを採用しており、複数人で共同開発しています。最も厄介なのは、ID とクラスが HTML ドキュメント全体に散在していることです。これはメンテナンスの際の落とし穴です。最近、id と class の使用についての誰かの経験を見て、それが良いと思いました。要約は次のとおりです。

css は、一般モジュールとプライベートモジュールに特別なクラス名を付けており、ID は一意であり、優先度が高すぎます。 js が DOM を操作するために使用するすべてのフックはスタイルを追加しません。jq または zepto を使用する場合、この部分のクラス名は通常、js によって決定されます。 ID。これは、大規模な複数人によるメンテナンスや長期にわたる反復プロジェクトに適しています。

CSS のクラス名は、JS 操作の ID およびクラスから完全に分離されているため、製品の UI または製品のインタラクション ロジックの変更は影響を受けません。お互いに影響を与えず、メンテナンスも簡単です。

まとめると、JSは可能な限りIDを操作しようとし、クラスは可能な限りCSSを操作しようとします！

もちろん、これは自分で練習する必要があります。私が現在取り組んでいるプロジェクトにのみ適しています。今日のまとめは以上です。不足している点があれば修正してください。

ID とクラスの違い、クラスと ID のどちらを使用するかについて詳しくは、PHP 中国語 Web サイトに注目してください。