Mengapa Saya Tidak Boleh Menambah Kelas pada Elemen SVG dengan jQuery?

jQuery SVG: Menyelesaikan Masalah Ketidakupayaan untuk menambahClass

Apabila bekerja dengan jQuery SVG, anda mungkin menghadapi masalah menambah atau mengalih keluar kelas daripada objek SVG. Dalam artikel ini, kami akan menyiasat punca dan menyediakan penyelesaian.

Masalahnya:

Pertimbangkan kod berikut:

<rect>

Walaupun sedang dapat mencetuskan amaran apabila mengklik objek, menambah kelas "diklik". gagal.

Penyelesaian:

Sebelum jQuery 3, menambah kelas pada elemen SVG adalah bermasalah. Walau bagaimanapun, isu ini telah diselesaikan dalam jQuery 3. Selain itu, penyemak imbas moden menyokong kaedah JavaScript classList.add('newclass') vanilla untuk elemen SVG.

Pendekatan jQuery Alternatif:

Jika anda lebih suka menggunakan jQuery, anda boleh memanipulasi atribut kelas secara langsung menggunakan attr():

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

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

Pendekatan JavaScript Vanila:

Untuk mengelakkan pergantungan jQuery, gunakan kod JavaScript vanila berikut:

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

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

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

Atas ialah kandungan terperinci Mengapa Saya Tidak Boleh Menambah Kelas pada Elemen SVG dengan jQuery?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!