js提取135编辑器相同的css

135编辑器导入的内容,有重复的很多css,导致加载很慢,只能去掉

function remove135FormatContent(content){
    	if(!content) return '';
    	//1.去掉135版本信息
        content=removeVersionInfo(content);
    	
        //2.去掉data-的无用属性
		content=removeDataAttr(content);
        
		//3.提取公用的style,写入class="",没有公用的还是放在 style
	    content=extractHTMLByStyleToClass(content);
		return content;
    }
    
    function removeDataAttr(content){
		if(!content) return '';
		
		//去掉data-的无用属性
        var reg=new RegExp('\\s+data-[\\w-]+\\s*=\\s*\"[\\s\\S]*?\"','g');
        var result=content.replace(reg, function($0){
		   return $0.replace(/^\s+/, '').indexOf('data-type')==0 ? $0 : ' ';
	    });
		//去掉空的属性
		result=result.replace(/\s+class=\"\"/g, "");
		result=result.replace(/\s+style=\"\"/g, "");
		
		//label="Powered by 135editor.com"
		result=result.replace(/\s+label=\"Powered by 135editor.com\"/g,"");
		// class="_135editor"
		result=result.replace(/\s+class=\"_135editor\"/g,"");

		//p><br/><br/></p>
		result=result.replace(/<p>(<br\s*\/?>)+<\/p>/g,"");
		
		result=result.replace(/<style>(<br>)+<\/style>/g,"");
		
		//这个权限有点大
		result=result.replace(/(<br>)+/g,"");
		
		//<p></p>
		result=result.replace(/<p><\/p>/g,"");
		
		//去掉title中是http的
		result=result.replace(/ title\s*=\s*\"https*[\s\S]*?\"/g,"");
		return result;
    }
    
    function extractHTMLByStyleToClass(content){
		if(!content) return "";
		//1.取出所有style
		var reg=new RegExp(' style\\s*=\\s*\"[\\s\\S]*?\"','g');
		var allstyles00 = content.match(reg);
		var allstyles=[];
		//style中包含url(或" 不处理
		for(var i in allstyles00){
			if(allstyles00[i].indexOf('url(')>=0){
				continue;
			}
			if(allstyles00[i].indexOf('"')>=0){
				continue;
			}
			allstyles.push(allstyles00[i]);
		}
		

		//2.计算每个style出现的次数
		var counts = {};
		for(var i in allstyles){
			var style = allstyles[i];
			if( !counts[style] ) counts[style]=0;
			counts[style]++;
		}

		//3.找到已有的zwedsty_的最大序号
		var prefix = "zwedsty_";
		var allHasPrefix = content.match(new RegExp('\\.'+prefix+'\\d+','g'));
		var maxClassNum = 0;
		for(var i in allHasPrefix){
			var num = allHasPrefix[i].substring(1+prefix.length);
			num = parseInt(num,10);
			if( maxClassNum < num) maxClassNum = num;
		}

		//3.对于有重复的style,换成class
		var classes = [];
		for(var style in counts){
			if(counts[style]<2)continue; //没有重复,不做处理
			if(style.length<=20)continue; //太短的,不做处理
			var oneClass = prefix + (++maxClassNum);
			//生成一个class
			classes.push( "."+ oneClass
				//+"{" +replaceStyleQuotToSymble(getMiddleString(style, '"', '"'))
					+"{" +getMiddleString(style, '"', '"')
				+ "}");
			//将style换成class
			content = myReplaceByString(content, style, 
				' class="' + oneClass + '"'); 
		}

		//将所有的class写到content最前面
		//var styleString = "<style>\n" + classes.join("\n") + "</style>\n" ;
		var styleString = "<style>" + classes.join("\n") + "</style>" ;
		//var styleString = "<style>" + classes.join(" ") + "</style>" ; 
		
		//有内容再去加
		if(classes.length>0){
			content = styleString + content;
		}
		return content;
	}

    function replaceStyleQuotToSymble(str){
    	if(!str) return str;
    	return myReplaceByString(str, '"', '"');
    }    
   //去掉135版本信息
	function removeVersionInfo(content){
		if(! content ) return "";
		var idx1 = content.indexOf('<section powered-by="135编辑器"');
		if(idx1<0) return content;
		var idx2 = content.lastIndexOf('</section>');
		if( idx2<0) idx2 = content.length;
		return content.substring(0, idx1) + content.substring(idx2+'</section>'.length);
	}
	//取“”中间的值
	function getMiddleString(content, tag1, tag2){
		if(!content || !tag1 || !tag2) return "";
		var idx1 = content.indexOf(tag1);
		if(idx1<0) return "";
		idx1 += tag1.length;
		var idx2 = content.indexOf(tag2, idx1);
		if( idx2<0) return "";
		return content.substring(idx1, idx2);
	}
	//替换函数
	function myReplaceByString(content, word, target){
		//使用字符串替换全部
		if(!content || !word ) return content;
		while(content.indexOf(word)>=0){
			content = content.replace(word, target);
		}

		return content;
	}

  

 

转载于:https://www.cnblogs.com/sunliyuan/p/11263497.html

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值