在網站開發中，我們經常會使用 JavaScript 和 CSS 來制作動畫效果。JavaScript 可以判斷頁面的狀態，并執行相應的 CSS 動畫效果，給用戶帶來良好的交互體驗。下面我們來看一下如何使用 JavaScript 來判斷執行 CSS 動畫。

// 獲取元素
var element = document.querySelector('.box');
// 判斷元素是否滿足條件
if (element.classList.contains('active')) {
// 執行動畫效果
element.style.animation = 'fadein 1s ease';
} else {
// 取消動畫效果
element.style.animation = 'none';
}

在上面的代碼中，我們首先獲取了一個類名為“box”的元素，然后使用 if 語句判斷元素是否滿足“active”類名的條件。如果滿足條件，我們給元素設置 CSS 動畫效果，并指定了動畫的時間、緩動函數等屬性。如果不滿足條件，我們則取消元素的動畫效果，讓它保持默認狀態。

在實際開發中，我們還可以結合其它 JavaScript 事件來觸發 CSS 動畫，比如鼠標點擊、頁面滾動等。同時，我們也可以使用 CSS3 的 transiton 和 transform 屬性來制作更加華麗的動畫效果，實現更高質量的用戶體驗。