jQuery: 'estilo' Configuración de atributos del elemento con objeto

Question

vi esto en nuestra base de código, el otro día:

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

map se define como:

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

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

    return cssValue.join(';'); 
} 

Es map necesariamente? ¿Hay una manera más corta de hacer esto?

Es importante tener en cuenta que el atributo "estilo" anula cualquier estilo establecido por una clase agregada/definida en el atributo "clase".

Answer 1

Probablemente no. Una mejor solución puede ser el uso de CSS:

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

Sin embargo, .attr('style',) elimina también el estilo en línea anterior, por lo que no se comporta exactamente de la misma.
Si va a utilizar attr, su entrada debe ser una cadena, no un objeto, no está especializada para trabajar con el atributo style. una alternativa en ese caso es:

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

Parece el limpiador en este caso. En otros casos, su map facilita la inserción de variables en el CSS.
map podría haber sido nombrado mejor sin embargo. También tiene un error de implementación - añade doble punto y coma entre los atributos: color:red;;cursor:default;

Una solución sencilla para quitar el estilo previas es llamar .removeAttr('style') antes de llamar css.

Answer 2

.addClass ('highlight') al elemento. Donde su clase CSS está predefinida. (esto funcionó para mí, ya que no quería tomar 2 cambios de atributo de estilo)