2016-04-26 29 views
5

È possibile abbinare tutti i nodi che hanno un attributo data-* utilizzando solo CSS?Selettore CSS universale per abbinare qualsiasi dato HTML- * attributi

Ecco alcuni esempi di attributi vorrei abbinare:

data-scope 
data-sessionlink 
data-visibility-tracking 

ho potuto fare

*[data-scope] *[data-sessionlink] *[data-visibility-tracking] 

ma cerco qualcosa di più compatto. Inoltre, non conosco tutti gli attributi possibili di data-* nella mia applicazione.

+0

Sono questi attributi o valori di attributo (ad es. Classe = "data-scope") – rsjaffe

+0

Questi sono attributi. – Vadim

+1

Dang. Esiste una ricerca con caratteri jolly per i valori degli attributi che iniziano con una stringa, ma non, per quanto ne so, gli attributi. – rsjaffe

risposta

3

È attualmente impossibile utilizzare le maschere jolly per selezionare gli elementi da una parte nome attributo.

C'è una recente thread nella mailing list [email protected], dove Simon Pieters da Opera ha proposto un bel possibile syntax che ha ottenuto alcuni accettazione nel thread, quindi c'è una possibilità che diventerà standard in futuro:

x-admin-* { ... } 
[data-my-*] { ... } 
+1

Grazie, Marat! Spero che un giorno saremo in grado di fare la selezione di caratteri jolly sui nomi degli attributi. – Vadim

+0

Non è la più grande idea - non ti permetterà di fare [data-my - * = 'esatta corrispondenza'] perché * = collide con un operatore esistente – gotofritz

+1

@gotofritz Buon punto. Ma questo potrebbe probabilmente essere risolto avvolgendo il nome dell'attributo stesso tra virgolette: "[" data-my- * "=" esatta corrispondenza "]' –