2017-03-04 17 views
2

私は2000ページの要素を持っているとしましょう。私はカスタムモジュールからこのページの要素(バナー)を挿入したいと思います。このモジュールのcssファイルには300以上のcssセレクタがあり、各セレクタには同じページ内の他のモジュールとの競合を避けるためにユニークなダイナミックプレフィックスが必要です。より多くのバナーをロードすることができますので、私は1つの一意のidセレクタを使用することはできませんので、私はこのようなものを使用する必要があります:CSS regex idセレクタとクラスセレクタのパフォーマンス

<div id="company_banner14"></div> 
<div id="company_banner15"></div> 
div[id^='company_banner']{ 

} 

または

<div id="company_banner14" class="company_banner"></div> 
<div id="company_banner15" class="company_banner"></div> 
.company_banner{ 

} 

パフォーマンス・ビューから優れている何を?正規表現のセレクタを使用して悪い練習、300の正規表現のセレクタは、目に見えるパフォーマンスの影響を与えるでしょうか?

+0

良い質問ですが、私もそれに興味があります。 – g5wx

+1

クラスセレクタを使用しない場合、class属性を持つことのポイントは何ですか?特にパフォーマンスを話しているとき。ちょうど...奇妙に思える。 – BoltClock

+0

あなたは正しい、これは私の間違いだった、私は質問を修正した。 – user1324762

答えて

-1

あなたが必要としているものを見てから、すべての要素にカスタムCSSを付けてください。このクエリでは留意すべき点がいくつかあります。インラインCSS-を使用して

  1. 私はあなたが一つの要素のための長いCSSを使用していない場合は、インラインCSSが最善の解決策だと思います。あなたのループが多すぎる要素の場合、非常に貴重なコードをページに保存します。たとえば、<div id="company_banner15" class="company_banner" style="Width:x; height:y;"></div>

  2. CSSクラスの使用 -これはインラインCSSの代替方法ですが、インラインCSSのコードセーバーとしては使用できません。すべての要素に同じ種類のスタイルを使用している場合は、ループ内で異なるスタイルのスタイルを使用していても正確ではありません。

これらのご意見をお待ちしています。感謝と歓声。

+0

各divにはさらに要素があるため、300種類のセレクタがあります。 300以上の要素に対してインラインCSSを使用することはできません。問題は、クラスセレクタまたはid正規表現セレクタを内部の300個の要素に使用する方が良い場合です。競合を避けるために、内部の各要素には親セレクターが定義されている必要があります。 – user1324762

関連する問題