您可以使用 CSS 按部分 ID 值來選擇元素嗎？

使用 CSS 透過部分 ID 值選擇元素

在 CSS 領域，精確識別元素至關重要。這個問題深入探討了不透過完整 ID 值而是透過部分匹配來選擇元素的可能性。

具有不完整 ID 的 PHP 產生的元素

問題源自於 PHP 產生的元素部分 ID 值。例如：

<div class="1" id="as_1"> ... </div>
<div class="2" id="bs_1"> ... </div>

<div class="1" id="as_2"> ... </div>
<div class="2" id="bs_2"> ... </div>

雖然類別屬性以共性將元素分組，但由於 ID 名稱不完整，因此單獨選擇它們的需要構成了挑戰。

與CSS 的部分ID 匹配

不幸的是，CSS ID 選擇器需要完整的ID 值，使得#as_{ ... } 和#bs_{ ... } 等建議無效。

屬性子字串選擇器：替代方案

屬性子字串選擇器提供了一種替代方法：

div[id^="as_"]
div[id^="bs_"]

這些選擇器匹配ID 值以指定字串開頭的元素。然而，如果其他元素在其 ID 中共享相似的前綴，則依賴此方法可能會導致意想不到的後果。

使用類別的實用解決方案

考慮到類別屬性的存在，一個更簡單的解決方案包括為每組元素分配一個公共類，並透過該類別透過 CSS 定位它們。類別名稱可以源自負責產生 ID 的 PHP 邏輯。這種方法簡化了選擇過程，同時保持了所需的特定性。

以上是您可以使用 CSS 按部分 ID 值來選擇元素嗎？的詳細內容。更多資訊請關注PHP中文網其他相關文章！