首頁 >web前端 >css教學 >為什麼我無法使用 jQuery 將類別新增到 SVG 元素?

為什麼我無法使用 jQuery 將類別新增到 SVG 元素?

Patricia Arquette
Patricia Arquette原創
2024-12-27 16:06:10965瀏覽

Why Can't I Add Classes to SVG Elements with jQuery?

jQuery SVG:解決無法新增類別的問題

使用jQuery SVG 時,您可能會遇到從SVG 物件新增或移除類別的問題。在本文中,我們將調查原因並提供解決方案。

問題:

考慮以下程式碼:

<rect>

儘管能夠在點擊物件時觸發警報,新增「clicked」類別失敗。

解決方案:

在 jQuery 3 之前,向 SVG 元素添加類別是有問題的。不過,這個問題已在 jQuery 3 中解決。此外,現代瀏覽器支援 SVG 元素的普通 JavaScript classList.add('newclass') 方法。

替代jQuery 方法:

如果你喜歡堅持使用jQuery,你可以直接使用操作類屬性attr():

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

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

普通JavaScript 方法:

要避免jQuery依賴,請使用以下普通 JavaScript 程式碼:

var element = document.getElementById("item");

// Add "newclass"
element.setAttribute("class", "oldclass newclass");

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

以上是為什麼我無法使用 jQuery 將類別新增到 SVG 元素?的詳細內容。更多資訊請關注PHP中文網其他相關文章!

陳述:
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn