7
votes

Définir l'arrière-plan avec la valeur de l'attribut de données

J'ai 16 section différent -tags. Chaque section -tag a un data - attribut pour définir une couleur de fond spécifique pour chaque section : xxx < P> Maintenant, je veux mettre cette couleur comme arrière-plan.

ce que j'ai déjà essayé
Dans cette question Valeurs CSS à l'aide de l'attribut de données HTML5 Dites la réponse, il devrait être possible de régler la couleur comme arrière-plan: attr (couleur-couleur); mais cela ne fonctionnera pas pour moi ...

J'ai regardé jQuery Data () Mais je ne sais pas comment définir l'arrière-plan de la totalité de la section -tags.

Toute autre solution ou astuces Comment gérer cela avec < Code> JQuery Data () ?


3 commentaires

Pas une réponse, donc cela va comme un commentaire: attr est destiné uniquement dans :: avant et :: après contenu généré: Stackoverflow.com/a/1044862/148412


La question que je voudrais vraiment demander est pourquoi ne pas utiliser un nom de classe?


Parce que je charge ces sections avec Ajax et c'est plus facile pour moi de le gérer. Et je pense qu'il y a moins de lignes de code lorsque j'ajoute une seule déclaration pour régler l'arrière-plan ...


4 Réponses :


3
votes

Essayez ce code, xxx

http://jsfiddle.net/zcpyv /


0 commentaires

3
votes

Vous devez obtenir l'attribut couleur et attribuer à l'arrière-plan dans le CSS: xxx

effet vivant: http://jsfiddle.net/pk5dk/


2 commentaires

@mplungjan Vous pouvez le faire avec les deux, mais attr semble être plus rapide que les données lors de la récupération des données.


+1 , et je m'attendrais à utiliser simplement en utilisant ceci.style.backgroundColor = ceci.getatTtribute ("Color de données"); comme le corps de la fonction pour être encore plus rapide.



0
votes

Essayez ceci: - http://jsfiddle.net/adioo7/jgfky/

JS: - xxx

html: - xxx


0 commentaires

8
votes

3 commentaires

Approche intéressante mais pas si vite le comparant avec un chacune boucle: JSPERF.COM/ chacun vs-retour1


@Steve c'est correct, j'apprécie ce genre de commentaire :) Même dans votre cas, vous devez utiliser les données d'objet non attribuées.


Merci à vous deux pour votre réponse / commentaire. Combiné, la meilleure solution! +1 à vous deux: p