Question

我想让两个事件取决于菜单的scale属性。这是我的div：

<div class="starting-point">
    <span class="" style="transform: scaleX(1) scaleY(1); height: 2760.56px; width: 2760.56px; top: -1380.28px; left: -1380.28px;"></span>
</div>

如何将transform: scaleX(1) scaleY(1)变为变量？有时值为scaleX(0) scaleY(0)，我想根据这些值执行不同的操作。

我为此范围分配了dddd类，我尝试了这个，但结果中没有任何比例或有用的东西。

var style = getComputedStyle(document.getElementsByClassName('dddd')[0])

非常感谢。

Answer 1

你走了：

var style = getComputedStyle(document.getElementsByClassName('dddd')[0], null);

console.log(style.getPropertyValue('transform'));

修改1：

如果您不想添加课程，可以像这样更改代码：

var style = getComputedStyle(document.querySelector('.starting-point span'), null);

console.log(style.getPropertyValue('transform'));

编辑2：

您可以将其更改为使用jQuery选择器：

var style = getComputedStyle($('.starting-point span')[0], null);

console.log(style.getPropertyValue('transform'));

Answer 2

由于您正在添加jquery标记，因此如果您使用其API

则更清晰

var style = $('.starting-point span').attr('style').split(';')[0];

Answer 3

您还可以使用正则表达式来使用更通用的方法。

var matrix = $('.selector').css('transform');
var values = matrix.match(/-?[\d\.]+/g);

这将获得您可以根据索引值获取特定属性的所有转换属性。如：

console.log(values[0]);

在Javascript中获取元素的transform类属性

3 个答案: