在JavaScript中調用CSS的方法有多種，以下是一些常見的調用方式：

1、直接操作樣式：

JavaScript可以直接操作HTML元素的樣式屬性，如果你想改變一個元素的背景顏色，可以這樣做：

document.getElementById('myElement').style.backgroundColor = 'red';

2、使用類名操作：

JavaScript可以通過改變元素的類名來調用不同的CSS樣式，你需要在CSS中定義好不同的類名對應的樣式，然后通過JavaScript來添加或移除類名。

// 定義一個函數來添加類名
function addClass(element, className) {
    element.classList.add(className);
}
// 定義一個函數來移除類名
function removeClass(element, className) {
    element.classList.remove(className);
}
// 使用示例
var myElement = document.getElementById('myElement');
addClass(myElement, 'myClass'); // 將類名'myClass'添加到元素上
removeClass(myElement, 'myClass'); // 移除元素上的類名'myClass'

3、使用CSSOM（CSS對象模型）：

CSSOM是一個接口，允許JavaScript動態(tài)地訪問和修改CSS樣式信息，通過CSSOM，你可以獲取到當前文檔的樣式表，并對其進行修改。

// 獲取當前文檔的樣式表
var stylesheet = document.styleSheets[0];
// 獲取樣式表中的規(guī)則
var rules = stylesheet.cssRules || stylesheet.rules;
// 遍歷規(guī)則并打印出來
for (var i = 0; i < rules.length; i++) {
    console.log(rules[i].selectorText + ': ' + rules[i].style.cssText);
}

4、使用動畫和過渡：

JavaScript還可以與CSS的動畫和過渡功能結合使用，來實現(xiàn)更豐富的交互效果，你可以使用requestAnimationFrame函數來逐幀控制動畫效果。

function animate(element, from, to, duration) {
    var start = performance.now();
    var timer = setInterval(function() {
        var progress = (performance.now() - start) / duration;
        if (progress > 1) progress = 1;
        element.style.transform = 'translateX(' + (from + (to - from) * progress) + 'px)';
        if (progress === 1) {
            clearInterval(timer);
        }
    }, 16); // 每16ms更新一次，大約60幀/秒
}

是一些常見的JavaScript調用CSS的方法，你可以根據自己的需求選擇適合的方式來操作元素的樣式。