Rumah  >  Artikel  >  hujung hadapan web  >  Bolehkah JavaScript Mengakses Nilai Sifat CSS Tidak Sah?

Bolehkah JavaScript Mengakses Nilai Sifat CSS Tidak Sah?

DDD
DDDasal
2024-10-24 07:16:30586semak imbas

Can JavaScript Access Values of Invalid CSS Properties?

Bolehkah JavaScript Mendapatkan Nilai Harta CSS Tidak Sah?

Sifat CSS tersuai, dilambangkan dengan nama yang diawali dengan sengkang, menawarkan mekanisme untuk menentukan dan mengakses gaya unik dalam aplikasi. Walau bagaimanapun, bolehkah JavaScript mengakses nilai sifat tersuai ini jika ia tidak sah atau tidak dikenali oleh penyemak imbas?

Penjelasan

Objek CSSStyleDeclaration mendedahkan sifat gaya elemen dalam JavaScript. Apabila menemui nama sifat yang tidak sah, seperti "-my-foo", objek ini biasanya melangkau harta tersebut dan meneruskan dengan sifat sah yang lain.

Spesifikasi Gaya DOM-Level-2 mencadangkan bahawa semua sifat CSS dalam blok pengisytiharan harus boleh diakses melalui antara muka CSSStyleDeclaration, termasuk yang tidak sah. Walau bagaimanapun, dalam amalan, penyemak imbas seperti Chrome dan Firefox tidak menyokong gelagat ini.

Walaupun kekurangan akses JavaScript langsung kepada nilai sifat CSS yang tidak sah, pendekatan alternatif melibatkan menghurai teks CSS mentah. Dengan mengekstrak sifat gaya daripada elemen gaya yang sepadan, anda boleh mengenal pasti dan mendapatkan semula nilai sifat tersuai secara manual, walaupun ia tidak sah.

Contoh Kod

The kod berikut menunjukkan cara menghuraikan teks CSS mentah dan mendapatkan semula nilai sifat "-my-foo":

const styleText = document.getElementsByTagName("style")[0].innerText;
const propertyName = "-my-foo";

const value = styleText.match(new RegExp(`\b${propertyName}:\s*(.+?)\b`, "i"))[1];

Nota: Pendekatan ini memerlukan ungkapan biasa untuk memadankan nama harta tersuai dan ekstrak nilainya. Ia dianggap sebagai penyelesaian peringkat rendah dan mungkin bukan kaedah yang paling cekap atau sesuai untuk semua senario.

Atas ialah kandungan terperinci Bolehkah JavaScript Mengakses Nilai Sifat CSS Tidak Sah?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan:
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn