jQuery가 SVG 개체에서 클래스를 추가하거나 제거하지 않는 이유는 무엇이며 어떻게 해결할 수 있습니까?

jQuery SVG: 객체에 클래스 추가 또는 제거

jQuery SVG로 작업할 때 SVG 객체에서 클래스를 추가하거나 제거하는 데 어려움을 겪을 수 있습니다. 다음은 일반적인 실수와 해결 방법입니다.

문제:

SVG 개체에 클래스를 추가하려고 하는데 변경 사항이 표시되지 않습니다. SVG 및 jQuery 기능은 클릭 시 경고 실행과 같은 다른 작업에 대해 예상대로 작동합니다.

코드 예:

<rect>

해결책:

jQuery 3 이전 버전에서는 SVG 요소에 클래스를 추가하거나 제거할 수 없는 알려진 문제가 있습니다. 지원됩니다. 이 문제를 해결하려면 다음 접근 방식을 사용하는 것이 좋습니다.

• jQuery 3: jQuery 버전 3 이상으로 업데이트하면 이 문제가 해결됩니다.
• 바닐라 JavaScript: 대신 최신 버전에서 지원되는 classList.add() 또는 classList.remove() 메서드를 사용하세요. browsers:

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

• attr()을 사용하는 jQuery: jQuery를 계속 사용하려는 경우 대체 접근 방식은 .attr() 메서드를 사용하는 것입니다.

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

이러한 해결 방법은 특히 클래스 변경에만 영향을 미친다는 점을 기억하세요. 이벤트 처리 등 SVG 요소와의 기타 jQuery 상호작용은 의도한 대로 작동해야 합니다.

위 내용은 jQuery가 SVG 개체에서 클래스를 추가하거나 제거하지 않는 이유는 무엇이며 어떻게 해결할 수 있습니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!