jQuery: Réglage attribut 'style' de l'élément avec l'objet

Question

J'ai vu cela dans notre base de code, l'autre jour:

  link.attr('style', map({ 
       color: '#9a4d9e', 
       cursor: 'default' 
      })); 

map est défini comme:

function map(map) { 
    var cssValue = []; 

    for (var o in map) { 
     cssValue.push(o + ':' + map[o] + ';') 
    } 

    return cssValue.join(';'); 
} 

est-map nécessairement? Y a-t-il un moyen plus court de le faire?

Il est important de noter que l'attribut "style" remplace tout style défini par une classe ajoutée/définie dans l'attribut "class".

Answer 1

Probablement pas. Une meilleure solution peut consister à utiliser les CSS:

link.css({color: '#9a4d9e', 
      cursor: 'default'}); 

Cependant, .attr('style',) supprime également le style de ligne précédent, donc il ne se comporte pas exactement la même chose.
Si vous allez utiliser attr, son entrée doit être une chaîne, pas un objet, il n'est pas spécialisé pour fonctionner avec l'attribut style. une alternative dans ce cas est:

link.attr('style', "color:'#9a4d9e';cursor:'default'"); 

Semble plus propre dans ce cas. Dans d'autres cas, votre map facilite l'insertion de variables dans le CSS.
map aurait pu être mieux nommé cependant. Il a également une erreur de mise en œuvre - il ajoute doubles points-virgules entre les attributs: color:red;;cursor:default;

Une solution simple pour supprimer le style avant-premières est d'appeler .removeAttr('style') avant d'appeler css.

Answer 2

.addClass ('highlight') à l'élément. Où votre classe css est prédéfinie. (cela a fonctionné pour moi car il ne voulait pas prendre 2 changements d'attribut de style)