Выберите элементы, где атрибут не пуст
Предположим, что у меня есть следующее:
<div data-pid="">Unknown</div>
<div data-pid="123">Known 123</div>
Есть ли способ в CSS выбирать только те элементы, где атрибут data-pid
не пуст?
Ответы
Ответ 1
Это работает, если вы не против делать что-то немного назад, и вам нужно, чтобы он работал в браузерах, которые не поддерживают :not
:
div[data-pid] {
color: green;
}
div[data-pid=""] {
color: inherit;
}
Это сделает все div
с непустым data-pid
зеленым.
Заклинание здесь: http://jsfiddle.net/ZuSRM/
Ответ 2
Выглядит уродливо, но что-то вроде этого должно это сделать:
[data-pid]:not([data-pid=""])
jsFiddle Demo
С небольшим Javascript вы также можете добавлять классы, если вам нужно поддерживать старые браузеры.
Ответ 3
/* Normal styles */
[data-pid] {}
/* Differences */
[data-pid=""] {}
jsFiddle.
Это будет иметь гораздо лучшую поддержку браузера. Вместо того, чтобы выбирать те, которые вы хотите, поместите их все, а затем поместите различия во втором селекторе.