笔记

自从撰写本文以来，突变事件已被弃用，并且可能并非所有浏览器都支持。相反，使用突变观察者。

是的你可以。DOM L2 Events module定义了突变事件；其中之一 - DOMAttrModified是您需要的。当然，这些并没有被广泛实现，但至少在 Gecko 和 Opera 浏览器中得到支持。

尝试以下方法：

document.documentElement.addEventListener('DOMAttrModified', function(e){
  if (e.attrName === 'style') {
    console.log('prevValue: ' + e.prevValue, 'newValue: ' + e.newValue);
  }
}, false);

document.documentElement.style.display = 'block';

您还可以尝试使用IE 的“propertychange”事件作为DOMAttrModified. 它应该允许style可靠地检测变化。

您可以使用attrchange jQuery 插件。该插件的主要功能是绑定一个监听HTML元素属性变化的函数。

代码示例：

$("#myDiv").attrchange({
    trackValues: true, // set to true so that the event object is updated with old & new values
    callback: function(evnt) {
        if(evnt.attributeName == "display") { // which attribute you want to watch for changes
            if(evnt.newValue.search(/inline/i) == -1) {

                // your code to execute goes here...
            }
        }
    }
});

您可以使用 jQuery 的css函数来测试 CSS 属性，例如。if ($('node').css('display') == 'block').

Colin 是对的，当特定的 CSS 属性发生更改时，不会触发任何显式事件。但是您可以翻转它，并触发一个设置显示的事件，等等。

还可以考虑使用添加 CSS 类来获得所需的行为。通常，您可以向包含元素添加一个类，并使用 CSS 来影响所有元素。我经常在 body 元素上添加一个类来指示 AJAX 响应正在等待中。然后我可以使用 CSS 选择器来获得我想要的显示。

不确定这是否是您要查找的内容。

对于 css transition 会影响的属性，可以使用 transitionend 事件，例如 z-index：

$(".observed-element").on("webkitTransitionEnd transitionend", function(e) {
  console.log("end", e);
  alert("z-index changed");
});

$(".changeButton").on("click", function() {
  console.log("click");
  document.querySelector(".observed-element").style.zIndex = (Math.random() * 1000) | 0;
});

.observed-element {
  transition: z-index 1ms;
  -webkit-transition: z-index 1ms;
}
div {
  width: 100px;
  height: 100px;
  border: 1px solid;
  position: absolute;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button class="changeButton">change z-index</button>
<div class="observed-element"></div>

你不能。CSS 不支持“事件”。我敢问你需要它做什么？在 SO 上查看这篇文章。我想不出你想要将一个事件与风格变化挂钩的原因。我在这里假设样式更改是由一段 javascript 触发的。为什么不在那里添加额外的逻辑？