JavaScript是一種強大的編程語言，能夠用于將網頁變得更加生動和活潑。與此同時，CSS3也提供了豐富的動畫特效。如何使用JavaScript觸發CSS3動畫呢？下面我們就來介紹一下。

// 獲取需要觸發動畫的元素
var element = document.getElementById("animate");
// 在元素上添加CSS類名
element.classList.add("animated");
// 監聽CSS動畫結束事件
element.addEventListener("animationend", function() {
// 動畫結束后執行的操作
console.log("Animation ended.");
});

在上面的代碼中，我們首先使用JavaScript獲取需要添加動畫的元素，然后在它上面添加CSS類名，這樣就可以觸發CSS3動畫了。同時，我們還監聽了動畫結束事件，并在動畫結束后執行了一個簡單的操作。

值得注意的是，在CSS中定義動畫時，需要添加一個關鍵幀名為“animated”的類名，并定義相應的動畫效果，如下所示：

.animated {
animation-name: fadeOut;
animation-duration: 1s;
animation-fill-mode: forwards;
}
@keyframes fadeOut {
0% {
opacity: 1;
}
100% {
opacity: 0;
}
}

上面的代碼定義了一個名為“fadeOut”的動畫效果，當添加了“animated”類名的元素觸發這個動畫時，它會從不透明度為1的狀態逐漸變為不透明度為0的狀態，持續時間為1秒。

總的來說，使用JavaScript觸發CSS3動畫需要添加CSS類名和監聽動畫結束事件，同時還需要在CSS中定義相應的動畫效果。