Bagaimana untuk mengekstrak Keseluruhan Kandungan Peraturan CSS sebagai Rentetan?

Cara Mengekstrak Nilai Peraturan CSS

Bagaimana anda boleh mengembalikan rentetan yang mengandungi semua kandungan peraturan CSS, seperti format yang anda' d lihat dalam gaya sebaris? Ini boleh dilakukan tanpa mengetahui kandungan khusus peraturan, mengelakkan keperluan untuk mengekstraknya mengikut nama gaya.

Pertimbangkan CSS berikut:

.test {
    width:80px;
    height:50px;
    background-color:#808080;
}

Untuk bermula, kami mempunyai perkara berikut kod:

function getStyle(className) {
    var classes = document.styleSheets[0].rules || document.styleSheets[0].cssRules
    for(var x=0;x<classes.length;x++) {
        if(classes[x].selectorText==className) {
            //this is where I can collect the style information, but how?
        }
    }
}
getStyle('.test')

Membina jawapan scunliffe dan menyesuaikan diri daripada sumber lain, kami boleh meningkatkan kod ini untuk mengekstrak peraturan CSS values:

function getStyle(className) {
    var cssText = "";
    var classes = document.styleSheets[0].rules || document.styleSheets[0].cssRules;
    for (var x = 0; x < classes.length; x++) {        
        if (classes[x].selectorText == className) {
            cssText += classes[x].cssText || classes[x].style.cssText;
        }         
    }
    return cssText;
}

alert(getStyle('.test'));

Kod ini merentasi peraturan CSS, menyemak sama ada teks pemilih sepadan dengan nama kelas yang ditentukan. Untuk setiap peraturan padanan, ia mengumpul teks CSS yang sepadan dan mengumpulkannya ke dalam pembolehubah cssText. Akhir sekali, fungsi mengembalikan teks CSS terkumpul, menyediakan rentetan dengan format gaya sebaris yang diingini.

Atas ialah kandungan terperinci Bagaimana untuk mengekstrak Keseluruhan Kandungan Peraturan CSS sebagai Rentetan?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!