getComputedElementStyle

[ Function ]

public static getComputedElementStyle(
    element: Jquery<Element> | readonly Element[] | NodeListOf<Element> | HTMLCollectionOf<Element> | Element | undefined, 
    propertyName: string
): Dictionary<string>;

Returns an active CSS property of an HTML element. This also takes into account properties that affect CSS files. If the transferred object contains several elements (like for an jQuery collection), the first element is used.

Parameter

Name

Type

Description

element

Info: Type Element supported from version 1.10
Info: Types Element[] | NodeListOf<Element> | HTMLCollectionOf<Element> from version 1.10.1171.21

JQuery<Element>, readonly Element[], NodeListOf<Element>, HTMLCollectionOf<Element>, Element, undefined

  • jQuery collection with the element to be verified
  • any array-like element list (also for example from document.querySelectorAll() or document.getElementsByClassName())
  • individual element, for example HTML or SVG element.

propertyName

string

Name of the CSS property

Return value

Type

Description

Dictionary<string>

Object with the CSS property of the first element in the jQuery collection. If a requested property is not (or no longer) set, this entry is not set in the object.

Returns an empty object in the event of an error.

getComputedElementStyle 1:

Available from version 1.10

Sample - JavaScript

var control = TcHmi.Controls.get('TcHmiButton');
if(control === undefined){ 
    return; 
}
var cntrlElem = control.getElement();
var borderWidthStyle = 
TcHmi.StyleProvider.getComputedElementStyle(cntrlElem, 'border-width');
/* returns:
{
    'border-width': '0px',
}
*/
TcHmi.Log.debug('Border Width is: '+ borderWidthStyle['border-width']);