Question

如何从元素中获取当前应用的CSS属性标识符（不包括值）？

或者更确切地说：如何获取元素，例如translate，skew，rotate或rect？我并不是指完整的返回字符串，如：rect(300px 0px 0px 300px)。我的意思是property-identifiers ...

我对RegExp并不熟悉，但也许可以做到这一点？

因此，为了更好的解释目的：

我需要检查一下，更改一些值（通过矩阵数组）并再次将它们重新应用回元素。

// http://stackoverflow.com/a/5968313/1250044
function matrixToArray(matrix) {
    return matrix.substr(7, matrix.length - 8).split(', ');
}

$("#foo").css("clip","rect(300px 0px 0px 300px)");
var matrix = matrixToArray($("#foo").css("clip"));

                              // If `#foo` has something else
                              // applied than `clip`, then
                    --- ˅ --- // is that not really dynamically
$("#bar").css("clip", "rect(" + matrix[0] + matrix[1] + matrix[2] + matrix[3] + ")");

Answer 1

您可以使用window.getComputedStyle()：

// your elemenet
var el;

// get the transformations applied:
var transform = window.getComputedStyle( el ).transform;

但是，在大多数情况下，这将使您matrix而不是应用的单个转换。

Answer 2

如，

$(ele).css('rotate')

要检测，检查返回长度是否> 0

$(ele).css('rotate').length

Answer 3

得到了......

非常简单：

var getIdentifier = function(str) {
    return str.split('(')[0];
};

getIdentifier( 'rect(300px 0px 0px 300px)' ) // => 'rect'

获取应用的css属性标识符

3 个答案: