首先，没有现成的css-changes事件，但是你可以自己创建一个，因为onchange只用于:input元素，而不用于css更改。
有两种方法可以跟踪css的更改。
1.每隔x次（本例中为500毫秒）检查DOM元素是否有css更改。
1.当您更改元素css时触发一个事件。
1.使用DOMAttrModified mutation事件，但它已经过时了，所以我跳过它。

第一种方式：

var $element = $("#elementId");
var lastHeight = $("#elementId").css('height');
function checkForChanges()
{
    if ($element.css('height') != lastHeight)
    {
        alert('xxx');
        lastHeight = $element.css('height'); 
    }

    setTimeout(checkForChanges, 500);
}

第二种方式：

$('#mainContent').bind('heightChange', function(){
        alert('xxx');
    });

$("#btnSample1").click(function() {
    $("#mainContent").css('height', '400px');
    $("#mainContent").trigger('heightChange'); //<====
    ...
});

如果你控制css的变化，第二个选择是一个更优雅和有效的方法。

文件：

• bind：Description: Attach a handler to an event for the elements.
• trigger：Description: Execute all handlers and behaviors attached to the matched elements for the given event type.

请不要使用这里其他答案中描述的技术。它们要么不适用于css3动画大小的改变，要么不适用于浮动布局的改变，要么不适用于来自jQuery平台的改变。你可以使用一个大小检测器，一个基于事件的方法，这不会浪费你的CPU时间。
https://github.com/marcj/css-element-queries
它包含可用于此目的的ResizeSensor类。

new ResizeSensor(jQuery('#mainContent'), function(){ 
    console.log('main content dimension changed');
});

• 免责声明：我编写了这个库 *

如果你不需要支持〈IE11，那么你应该使用MutationObserver。
这里是一个链接到caniuse js MutationObserver
使用简单，效果显著。

var observer = new MutationObserver(function (mutations) {
        //your action here
    });

    //set up your configuration
    //this will watch to see if you insert or remove any children
    var config = { subtree: true, childList: true };

    //start observing
    observer.observe(elementTarget, config);

当你不需要再观察下去的时候就断开。

observer.disconnect();

查看MDN documentation了解更多信息

再举一个简单的例子。
对于本示例，我们可以使用100 x100DIV-box：

<div id="box" style="width: 100px; height: 100px; border: solid 1px red;">
 // Red box contents here...
</div>

还有一个jQuery小技巧：

<script type="text/javascript">
  jQuery("#box").bind("resize", function() {
    alert("Box was resized from 100x100 to 200x200");
  });
  jQuery("#box").width(200).height(200).trigger("resize");
</script>

步骤：

1.我们创建了DIV块元素，用于调整操作大小

• 添加简单的JavaScript代码：
• jQuery绑定
• 带有触发器动作“resize”的jQuery resizer-在我的示例中，触发器是最重要的
• 调整大小后，您可以检查浏览器警告信息

就这些。- ）

至于height或其他维度参数，可以使用ResizeObserver接口。

const divElem = document.querySelector('#mainContent');

元素类型不限于DIV，它可以是任何类型。然后，创建ResizeObserver接口的示例：

let myObserver = new ResizeObserver(entries => {
  console.log("Height changed. New height: "+$("#mainContent").height());
});

最后，调用observe（）方法，该方法启动指定的元素：

myObserver.observe(divElem);

每次调整元素大小时，都会触发observe（）方法。
请注意：ResizeObserver接口不能与Internet Explorer一起使用。
其他有价值的答案如下：如何检测DIV的尺寸变化？