element.attr(attrs [, opt])

Set presentation attributes (SVG and JointJS attributes) on view subelements. attr can either be an object or string representing a path to a nested attribute. If it is an object, the keys of the attrs object are selectors (JSON Markup Selector or CSS Selector) matching the subelements. The values are objects containing SVG attributes and their values. attrs object will be mixed with attrs property of the element model. This is a convenient way of rewriting only some of the attributes of the subelements. For overwriting all attributes of all subelements, use element.set('attrs', attrs).

element.attr({
    // selectors as defined in the JSON markup
    body: { refWidth: '100%', refHeight: '100%' },
    label: { text: 'My Label' },
    // using CSS selectors is significantly slower
    rect: { fill: 'blue' },
    text: { fill: 'white', fontSize: 15 },
    '.myrect2': { fill: 'red' }
});
The method is not suitable for storing custom data on the model. For that, use prop() or set() methods.
element.set('confirmed', true);
element.prop('data/count', 10);
element.attr(path, value [, opt])

An alternative call using a string/array path and a value:

element.attr('body/fill', 'red');
element.attr(['label', 'fontSize'], 12);
// Note: an equivalent expression is also
element.prop('attrs/label/fontSize', 12);
element.attr([path])

Get attribute value defined by a path. If no path provided the whole attrs object is returned.

element.attr('body/fill') === 'red';
element.attr(['label', 'fontSize']) === 12;