如何提取 CSS 规则值并将其作为内联样式返回？

提取 CSS 规则值

要提取 CSS 规则的值并以内联样式格式返回它们，需要一种通用方法。这涉及遍历所有 CSS 规则并根据其选择器识别目标规则。

考虑以下 CSS：

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

下面的代码片段演示了如何提取“. test”规则：

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;
}

var rules = getStyle('.test');

变量 cssText 现在将包含一个字符串，其中包含“.test”规则的 CSS 值，就好像它们一样以内联样式声明。这种方法用途广泛，可用于任何 CSS 规则，无论其内容如何。

以上是如何提取 CSS 规则值并将其作为内联样式返回？的详细内容。更多信息请关注PHP中文网其他相关文章！