어제 mergeCSS를 하다가 정규식 2개를 매칭하는 문제에 부딪혔는데, 결국 CSS Forest Group의 CE 동급생들의 도움으로 이 두 정규식을 특별히 기록해서 완성했습니다. 앞으로는 사용하세요.
첫 번째는 이미지 경로 일치 문제입니다. 처리할 문자열은 다음과 같습니다.
인용된 내용은 다음과 같습니다. |
내가 원래 쓴 내용은 다음과 같습니다.
인용된 내용은 다음과 같습니다. |
결과는 다음과 같습니다.
인용된 내용은 다음과 같습니다. |
보시다시피 두 장의 사진을 하나로 일치시킨 결과는 예상했던 것과 다릅니다. 다음과 같이 게으른 일치로 변경합니다.
인용된 내용은 다음과 같습니다. |
결과는 다음과 같습니다.
인용된 내용은 다음과 같습니다. url(demo.jpg); |
두 장의 사진이 일치했는데, 이는 원하는 결과입니다. :)
두 번째 문제는 정규식에서 변수를 사용하는 것입니다. 변수를 추가하는 것도 문제가 될 수 있는 이유를 먼저 간략하게 설명하겠습니다. RegExp 객체 와 교체() 메서드에 대한 설명을 살펴보겠습니다. :
인용된 내용은 다음과 같습니다. |
"/" 사이의 모든 내용은 정규식으로 처리되므로 변수 이름은 문자열로 처리됩니다. "/"를 추가하지 않고? 괜찮습니다만, "/"를 추가하지 않으면 일치 모드를 지정할 수 없고 첫 번째 것만 일치할 수 있습니다.
인용된 내용은 다음과 같습니다. 새로운 RegExp 객체는 지정된 모드와 플래그를 사용하여 RegExp 객체를 통해 생성될 수 있습니다. |
그 다음에:
인용된 내용은 다음과 같습니다.
|
여기서 주목해야 할 것은 "\"를 사용하여 이스케이프한다는 것입니다.
인용된 내용은 다음과 같습니다. 인수 패턴이 문자열이 아닌 정규 표현식인 경우 RegExp() 생성자는 지정된 RegExp와 동일한 패턴 및 플래그를 사용하여 새 RegExp 객체를 만듭니다. |
이 프로세스 동안 "\"는 ""로 변환됩니다. 즉, 위의 결과는 다음과 같습니다.
인용된 내용은 다음과 같습니다.
|