jQuery是一個流行的JavaScript庫，它可以方便地通過修改HTML文檔的CSS類來改變文檔的外觀。本文將介紹幾種使用jQuery轉換CSS類的方法。

// 1. 添加/刪除CSS類
$(selector).addClass(classname); //添加CSS類
$(selector).removeClass(classname); //刪除CSS類
// 示例
$(document).ready(function(){
// 添加CSS類
$("button").click(function(){
$("p").addClass("red");
});
// 刪除CSS類
$("button").dblclick(function(){
$("p").removeClass("red");
});
});

上面的代碼中，我們使用了addClass()和removeClass()方法來添加或刪除

元素中的CSS類。此時，我們只需將CSS定義在樣式表中，即可輕松實現文檔的樣式變化。

// 2. 切換CSS類
$(selector).toggleClass(classname); //切換CSS類
// 示例
$(document).ready(function(){
// 切換CSS類
$("button").click(function(){
$("p").toggleClass("red");
});
});

toggleClass()方法與addClass()和removeClass()方法不同之處在于，它可以同時切換CSS類的狀態。如果元素已經具有指定的CSS類，則這個方法將刪除該類，否則則添加該類。

// 3. 懸停事件
$(selector).hover(function(){
//懸停時執行的代碼
}, function(){
//離開時執行的代碼
});
// 示例
$(document).ready(function(){
// 在懸停時添加CSS類
$("p").hover(function(){
$(this).addClass("red");
},
// 在離開時刪除CSS類
function(){
$(this).removeClass("red");
});
});

最后，我們使用hover()方法來在鼠標懸停時添加CSS類，離開時刪除CSS類。

使用這些方法，我們可以輕松地控制網頁的外觀，為用戶提供更好的體驗。