用Javascript实现查看CSS属性使用频率的功能

来源:互联网 发布:淘宝上买ipad是正品吗 编辑:程序博客网 时间:2024/06/09 19:24
var str = "";var str = str.replace(/\s+"/g,"").match(/(;[\w-]+:)|({[\w-]+:)/g);var cssProperty = [];  //存储css属性的数组var result= [];        //存储结果的数组var obj = {};outloop:for(var i=0; i<str.length; i++){  var nstr = str[i].replace(/;/,"").replace(/{/,"").replace(/:/,"");  innerloop:  //过滤重复的css属性  for(var j=0; j<cssProperty.length; j++){    if(cssProperty[j] == nstr) continue outloop;    }  cssProperty.push(nstr);}//创建可以用来排序的对象for(var i=0; i<cssProperty.length; i++){ var totle = checkStr(cssProperty[i],str1);   obj["css"] = cssProperty[i];   obj["value"] = totle;   result.push(obj);   obj = {};}//重新排序结果数组result.sort(compare('value')).reverse();//打印for(var i=0; i<result.length; i++){  document.write(result[i]["css"]+":"+result[i]["value"]+"<br/>");}//用于数组排序的函数function compare(name){  return function(obj1,obj2){    var value1 = obj1[name];    var value2 = obj2[name];    if(value1<value2){      return -1;    }    else if(value1>value2){      return 1;    }    else{      return 0;    }   };  }//返回有多少可以匹配的字符串(css属性)function checkStr(str,string){  var pattern = new RegExp('[^-]'+str+':','g');    var ar =[];  for(var i=0;i<string.length; i++){   var ex = pattern.exec(string);   var lastIndex = pattern.lastIndex;   if(lastIndex == 0) return ar.length;   ar.push(lastIndex);     }}


现在只要给变量str赋css样式字符串,运行就可以看到结果了,我拿了个3000多行的样式表打印的结果如下:


0 0
原创粉丝点击