JQuery: установка атрибута 'style' элемента с объектом

Я видел это в нашей кодовой базе на днях:

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

map определяется как:

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

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

    return cssValue.join(';');
}

Является ли map обязательным? Есть ли более короткий способ сделать это?

Важно отметить, что атрибут "style" переопределяет любые стили, заданные классом, добавленным/определенным в атрибуте "class".

Ответ 1

Наверное, нет. Лучшим решением может быть использование CSS:

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

Однако .attr('style',) также удаляет предыдущий встроенный стиль, поэтому он не ведет себя точно так же.
Если вы собираетесь использовать attr, он должен быть строкой, а не объектом, она не специализируется на работе с атрибутом style. альтернативой в этом случае является:

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

В этом случае кажется более чистым. В других случаях ваш map упрощает вставку переменных в CSS.
map можно было бы назвать лучше, хотя. Он также имеет ошибку реализации - он добавляет две точки с запятой между атрибутами: color:red;;cursor:default;

Простым решением для удаления стиля предварительного просмотра является вызов .removeAttr('style') перед вызовом css.

Ответ 2

.addClass('highlight') для элемента. Где ваш класс css предопределен. (это сработало для меня, поскольку оно не хотело брать 2 изменения атрибутов стиля)