Bagaimanakah Saya Boleh Mengklon Gaya Elemen Dengan Mudah Menggunakan jQuery untuk Keserasian Merentas Pelayar?

Mendapatkan Gaya Elemen untuk Pengklonan Pseudo dalam jQuery

Masalahnya

Bayangkan anda mempunyai elemen span yang mengandungi teks dan ingin mencipta input teks yang sepadan dengan penampilannya. Bagaimanakah anda meniru gaya antara elemen ini menggunakan jQuery?

Pendekatan Sedia Ada

Satu kaedah ialah menyenaraikan semua sifat CSS yang mungkin secara manual dan mendapatkan semula nilainya menggunakan kaedah css jQuery. Walau bagaimanapun, pendekatan ini memakan masa dan terdedah kepada ralat disebabkan oleh banyaknya gaya yang tersedia.

Penyelesaian Komprehensif

Memperkenalkan pemalam jquery.getStyleObject, alat komprehensif yang mengambil semua kemungkinan gaya yang dikira untuk sesuatu elemen. Pemalam ini menghapuskan keperluan untuk menyenaraikan sifat secara manual dan memastikan keserasian dengan semua penyemak imbas, termasuk pelayar lama seperti IE.

Pelaksanaan

Untuk menggunakan pemalam, cuma panggil getStyleObject pada elemen yang dikehendaki:

var style = $("#element").getStyleObject();

Ini akan mengembalikan objek yang mengandungi semua gaya yang dikira sebagai pasangan nilai kunci. Anda kemudian boleh menggunakan gaya ini pada elemen lain:

$("#cloned_element").css(style);

Faedah

Lengkap dan Serasi Penyemak Imbas:

jquery.getStyleObject menyediakan senarai lengkap gaya dalam semua penyemak imbas, memastikan penyemak imbas silang keserasian.

Kebolehlanjutan:

Jika perlu, anda boleh menambah gaya tambahan pada pemalam dengan mengubah suai fail JS pemalam.

Contoh Penggunaan:

Mengklon elemen dan menggunakan gaya:

$("#original").clone()
    .parent()
    .appendTo()
    .css($("#original").getStyleObject());

Atas ialah kandungan terperinci Bagaimanakah Saya Boleh Mengklon Gaya Elemen Dengan Mudah Menggunakan jQuery untuk Keserasian Merentas Pelayar?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!