Question

我正在上传一个css文件，我希望从中记录所引用的每种颜色。

因此，如果css文件有{background-color:#ffffff; color:#000000;}，我希望能够创建一个包含以下内容的列表：#ffffff, #000000。

这样做的最佳方式是什么？
我正在开发的项目是在GitHub上，如果你想要一些参考：https://github.com/yeremenko/farbe

提前感谢您提供的任何帮助！

function getFileContents () {
    var reader = new FileReader();

    reader.onload = function(contents) {
        var fileContents = contents.target.result;  //Stores file contents
        var singleColor  = /*magic*/;

    };

    reader.readAsText(selectedFile);            //Gets file contents into string

};

getFileContents();

Answer 1

我不确定这是否完全回答了你的问题，但是如果你有CSS文件并且你可以阅读它的内容，那么你可以简单地解析颜色。请记住，CSS中有更多类型的颜色规范。

示例：

#FFFFFF或#FFF作为十六进制规范;

正则表达式：#[0-9aA-fF]{3}和#[0-9aA-fF]{6}

(255,255,255)或(255,255,255,1)为RGB或RGBA规范

正则表达式：\([0-9]{1,3}( *, *)[0-9]{1,3}( *, *)[0-9]{1,3}( *, *[0-1]{1}(\.[0-9]*)?)\)

white作为颜色名称规范

这可能有点困难 - 通过在CSS中形成可用颜色名称列表并单独查找它们，找到这些可能是最简单的。

考虑到这一点，您可以执行

var cssContent = cssFile.readContent(); // get the file into a String
firstPattern = "/`#[0-9aA-fF]{3}/g";
var matches = firstPattern.exec(cssContent);
while(matches!=null){
    // append to your output
}
//and so on for other patterns

希望它至少有一点帮助！

使用Javascript从CSS文件中提取颜色

1 个答案: