js+css3如何实现监听过渡动画结束事件

如何利用js+css实现监听过渡动画结束事件，下面web建站小编给大家详细介绍一下transitionend的用法！

css样式：

#div {
  height: 80px;
  width: 80px;
  background-color: red;
  transition: width 2s linear 0s;
}

#div:hover {
  width: 240px;
}

js代码：

let animates = document.getElementById("div")
animates.addEventListener("transitionend", function () {
  console.log('过渡动画结束的宽度：' + animates.scrollWidth);
});