how to get true css property names from CSSStyleDeclaration object?

Question

The thing is that some css properties have different name is javascript, for example textOverflow in js is text-overflow in css.

Is there a translation table somewhere in js engine that I can access or I must do myself a translation array or object like:

transObj = { textOverflow : 'text-overflow' };

For example I'm looping through this object and all I get is only js names:

for (var n in csd) {
  if (!csd.hasOwnProperty(n)) continue;
  csd[n].getTrueCSSName() // is there something like this ?
}

Or maybe simple regex replace will be ok, but I don't know if rule that all big letters in js names tranlsate to -[a-z] in css names ?

Answer 1

All css style which contain a - are replaced by their camelCase representation in ECMAscript, since we can't use - in all occasions. You can translate the names, by invoking a regular expression like this:

var name = "font-width";

// convert names like "font-width" into css camelCase form like "fontWidth"
name = name.replace( /-(\w)/g, function _replace( $1, $2 ) {
    return $2.toUpperCase();
});

which also works for like -webkit-box-shadow or whatnot.