html - 文字列で始まるIDをCSSに選択させる方法(Javascriptではない)は?

Question

HTML に次のような要素がある場合:

id="product42"
id="product43"
...

「product」で始まるすべての ID を一致させるにはどうすればよいですか?

JavaScriptを使用してこれを正確に行う回答を見てきましたが、CSSのみで行うにはどうすればよいですか?

score 445 · Accepted Answer

[id^=product]

^=「で始まる」を示します。逆に、$=「で終わる」を示します。

記号は実際には Regex 構文から借用したもので、^と$はそれぞれ「文字列の開始」と「文字列の終了」を意味します。

詳細については、仕様を参照してください。

score 75 · Accepted Answer

私は次のようにします：

[id^="product"] {
  ...
}

理想的には、クラスを使用します。これがクラスの目的です：

<div id="product176" class="product"></div>
<div id="product177" class="product"></div>
<div id="product178" class="product"></div>

そして今、セレクターは次のようになります。

.product {
  ...
}

score 7 · Accepted Answer

7

[id^=product]{property:value}

于 2012-07-15T23:58:25.740 に答える

score 0 · Accepted Answer

同じことを行う別の CSS セレクターがあることに気付きました。構文は次のとおりです。

[id|="name_id"]

これにより、二重引用符で囲まれた単語で始まるすべての要素 ID が選択されます。

5 に答える 5