Comment extraire l'intégralité du contenu de la règle CSS sous forme de chaîne ?

Comment extraire les valeurs d'une règle CSS

Comment renvoyer une chaîne contenant tout le contenu d'une règle CSS, comme le format que vous avez Voudriez-vous voir dans un style en ligne ? Cela peut être fait sans connaître le contenu spécifique de la règle, évitant ainsi d'avoir à les extraire par nom de style.

Considérez le CSS suivant :

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

Pour commencer, nous avons ce qui suit code :

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')

En nous basant sur la réponse de scunliffe et en nous adaptant à partir d'une autre source, nous pouvons améliorer ce code pour extraire la règle CSS valeurs :

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'));

Ce code parcourt les règles CSS, vérifiant si le texte du sélecteur correspond au nom de classe spécifié. Pour chaque règle de correspondance, il collecte le texte CSS correspondant et l'accumule dans la variable cssText. Enfin, la fonction renvoie le texte CSS accumulé, fournissant une chaîne avec le format de style en ligne souhaité.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!