제거 CSS 선택기 나는 특정 CSS 선택기를 제거하기 위해 노력하고 있어요

Question

를 필요한 경우 속성을 관련이 스크립트가 제거됩니다보다 속성 목록에 더 이상 선택기가없는 경우 ...

내가 얻을 수있었습니다 스크립트 작업의 일부 : 여기 http://jsfiddle.net/jnbdz/MarRr/5/

코드입니다 :

$$('button')[0].addEvent('click', function(){ 

var css = document.id('css').get('text'); 

var newCss = css.replace(/(\n|\r|\s\s)/g, "") 
.replace(/(,\s*body\s*(?={)|,\s*body\s*(?=,)|body\s*,|,\s*head\s*(?={)|,\s*head\s*(?=,)|head\s*,)/gi, "") 
.replace(/(body\s*(?={)|head\s*(?={))/gi, "") 
.replace(/(^\{[^}]*?\}|\}\s*\{[^}]*?\})/gim, ""); 

document.id('cleancss').set('text', newCss); 

}); 

문제는 내가 제거하면 라인이 I 습관과 관련이없는 속성을 제거 할 수 쓴 스크립트를 나누기 때문이다 모든 셀렉터 ...

나는 라인이 작동 나누기 유지하는 경우 ... 또한

, 내 코드가 좋은 경우 정규식 좋은 코더 알고 싶습니다 ...

미리 감사 어떤 도움이든.

Answer 1

마지막으로 multiline 플래그를 사용하고 있습니다. 첫 번째 교체 후 수행하는 한 줄만있는 경우 작동하지 않습니다. 따라서 선택기를 제거한 후 줄 바꿈을 먼저 유지하고 제거하십시오.

또한 정규 표현식을 약간 단순화 할 수 있습니다. x(?=a)|x(?=b) 대신 x(?=a|b)을 사용하십시오. 게으른 일치도 필요하지 않습니다 [^\}]*?.

다음은 작동 예제입니다. 명확성을 위해 셀렉터 body 만 제거했습니다.

$$('button')[0].addEvent('click', function(){ 

    var css = document.id('css').get('text'); 

    var newCss = css 
     // replace multiple tabs or spaces by one 
     .replace(/(|\t)+/g, " ") 
     // remove space at beginning of line 
     .replace(/(^\s)/gm, "") 
     // remove body in selector lists 
     .replace(/(,\s*body\s*(?={|,)|body\s*,)/gi, "") 
     // remove body before { 
     .replace(/(body\s*(?={))/gi, "") 
     // remove rules without selector 
     .replace(/[\n\r]+\{[^\}]*\}/g, "") 
     // remove linebreaks 
     .replace(/[\n\r]+/g, ""); 

    document.id('cleancss').set('text', newCss); 

}); 

당신은 더 {의 앞에 또는 당신이 그것을 사용하는 것으로 나타나는 mootools` 태그를`추가 : 및 ,