获取所有样式属性颜色

瓦克

我正在寻找一种从网站获取所有CSS颜色的方法。到目前为止,可以使用document.styleSheets处理内部样式表和外部样式表。问题在于,通过css样式属性直接分配给标签的样式将不在此列表中。

是否有比遍历DOM的所有元素并解析每个标签的style属性更好的方法?你还有其他建议吗?

失物招领

此函数将返回通过内联样式或CSS类声明的rgb / rgba颜色数组

function getAllColors() {
    // regex via http://stackoverflow.com/a/7543829/149636
    var rgbRegex = /^rgba?\((\d+),\s*(\d+),\s*(\d+)(?:,\s*(\d+(?:\.\d+)?))?\)$/;

    var allColors = [];

    var elems = document.getElementsByTagName('*');
    var total = elems.length;

    var x,y,elemStyles,styleName,styleValue,rgbVal;

    for(x = 0; x < total; x++) {
        elemStyles = window.getComputedStyle(elems[x]);

        for(y = 0; y < elemStyles.length; y++) {
            styleName = elemStyles[y];
            styleValue = elemStyles[styleName];

            if(!styleValue) {
                continue;
            }

            // convert to string to avoid match exceptions
            styleValue += "";

            rgbVal = styleValue.match(rgbRegex);
            if(!rgbVal) { // property does not contain a color
                continue;
            }

            if(allColors.indexOf(rgbVal.input) == -1) { // avoid duplicate entries
                allColors.push(rgbVal.input);
            }

        }

    }

    return allColors;
}

示例:http//jsfiddle.net/8MqJH/6/

本文收集自互联网,转载请注明来源。

如有侵权,请联系 [email protected] 删除。

编辑于
0

我来说两句

0 条评论
登录 后参与评论

相关文章

RegEx删除背景颜色和颜色属性,但将所有样式保留在php中

如何只获取没有样式属性的div?

文档样式表使用伪选择器获取元素上的所有样式

Angular 2绑定所有样式

在哪里可以找到react native支持的所有样式属性列表?

向样式组件中添加所有样式系统属性会对性能产生什么影响?

没有样式的Delphi Statictext字体颜色更改

有没有办法使用Apache Tika从文档文件中获取所有样式?

所有卡都没有样式

从DraftJS中粘贴的文字中删除所有样式?

如何清除JTextPane中的所有样式?

从超链接中删除所有样式/格式

清除所有样式(带标题的标题除外)

如何清除子元素中的所有样式?

如何识别没有样式属性的<li>标签?

获取所有CSS类的背景和颜色属性值

CSS没有样式<a>

如何删除所有样式和JavaScript,并在wordpress中包括新样式和JavaScript

jQuery:将样式属性添加到现有样式

传单:如何在没有样式属性的GeoJSON对象中设置2000+点的样式?

如何基于带有样式组件的属性添加多种样式?

添加带有样式的materializecss芯片--如何获取样式?

带有样式组件的条件样式

带有样式组件的样式链接

CSS-具有样式和颜色的多个文本装饰

没有样式显示时未为输入颜色设置ng-model

如何同时绘制带有样式编码和颜色编码的swarmplot / stripplot

导入带有javascript的html文件(以及所有样式表和脚本)?

CSS规则具有样式属性是否有效?