Как применить стили к элементу с префиксным идентификатором?

Question

Мне нужно применить стиль к повторяющемуся элементу, который имеет фиксированный префикс в своем идентификаторе.например, для сгенерированного идентификатора old-price-520, old-price является префиксом, а числовой суффикс будет различным.

Как применить стили к этим элементам или как я могу ссылаться на них с помощью CSS?

Вот иллюстрация того, что я хотел бы сделать:

#old-price-* {
    // some styles
}

Answer 1

div[id|="old-price"]

выберет все div элементы с id = old-price-*

Handycap - это его производительность, которая довольно низка по сравнению с мощностью # id-селектора.Кроме того, он имеет более низкую специфичность, чем обычный #.

edit:

скрипка

Answer 2

Вы можете попробовать использовать селекторы атрибутов CSS3 следующим образом:

div[id^=old-price]
{
    // some styling
}

Однако вам нужно будет добавить JavaScript для браузеров, которые его не поддерживают

Answer 3

Вы можете сделать это с помощью селектора атрибута begin-with в CSS3, например, так:

[Attr^="value"]

и конкретный пример будет выглядеть так:

*[id^="old-price-"]

тамВероятно, существует больше способов достижения того же результата, поэтому для быстрого ознакомления было предложено описание селекторов атрибутов *1007*.

Answer 4

Вы можете использовать jQuery для этого с помощью «Атрибут начинается с селектора»

http://api.jquery.com/attribute-starts-with-selector/