Pourquoi jQuery n'ajoute ou ne supprime-t-il pas de classes des objets SVG et comment puis-je y remédier ?

jQuery SVG : ajout ou suppression de classes à des objets

En travaillant avec jQuery SVG, vous pouvez rencontrer des difficultés pour ajouter ou supprimer des classes d'objets SVG. Voici une erreur courante et sa solution.

Problème :

Vous essayez d'ajouter une classe à un objet SVG, mais la modification n'apparaît pas. Les fonctionnalités SVG et jQuery fonctionnent comme prévu pour d'autres opérations, telles que le déclenchement d'alertes lors de clics.

Exemple de code :

<rect>

Solution :

Dans les versions de jQuery antérieures à 3, il existe un problème connu où l'ajout ou la suppression de classes aux éléments SVG n'est pas pris en charge. Pour résoudre ce problème, envisagez d'utiliser les approches suivantes :

• jQuery 3 : Mise à jour vers jQuery version 3 ou supérieure, qui résout ce problème.
• JavaScript Vanilla : Utilisez plutôt les méthodes classList.add() ou classList.remove(), qui sont prises en charge dans les versions modernes. navigateurs :

document.getElementById("p5").classList.add("clicked");

• jQuery avec attr() : Si vous préférez rester avec jQuery, une approche alternative consiste à utiliser la méthode .attr() :

$("#p5").attr("class", "jimmy clicked");

N'oubliez pas que ces solutions n'affecteront que spécifiquement les changements de classe. Les autres interactions jQuery avec les éléments SVG, telles que la gestion des événements, devraient fonctionner comme prévu.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!