如何使用 jQuery 在 SVG 元素中新增和刪除類別？

jQuery SVG：新增和移除類別

儘管使用jQuery SVG 建立互動式元素，但使用者在嘗試操作類別時有時會遇到困難。出現的一個問題是無法從 SVG 物件中新增或刪除類別。

問題：

jQuery 選擇器和事件處理程序與 SVG 元素無縫運行，允許執行諸如點擊時顯示警報。然而，嘗試利用 jQuery 的 addClass 方法為這些相同的元素添加類別卻是不成功的。

解：

核心問題在於 jQuery 無法直接修改類別版本 3 之前的 SVG 元素。此限制需要使用替代方法來新增和刪除類別：

依賴jQuery 的方法：

不要使用addClass 和removeClass，而是利用jQuery 的attr()方法來操作類別屬性：

// Add a new class
$("#item").attr("class", "oldclass newclass");

// Remove a class
$("#item").attr("class", "oldclass");

純JavaScript方法：

如果您不想依賴 jQuery，可以使用 JavaScript 的 setAttribute 方法直接操作元素的類別屬性：

// Add a new class
var element = document.getElementById("item");
element.setAttribute("class", "oldclass newclass");

// Remove a class
element.setAttribute("class", "oldclass");

以上是如何使用 jQuery 在 SVG 元素中新增和刪除類別？的詳細內容。更多資訊請關注PHP中文網其他相關文章！