regex (javascript)로 CSS3 선택기를 구문 분석

Question

누군가가이 질문을 전에 보았다면 연결하십시오, 아마도 잘못된 것을 검색하고 있습니다. 나는 CSS 파일을 파싱하기위한 결과 만 얻는다. 기본적으로 저는 셀렉터 배열을 가지고 있습니다.

[".thislink", "#myid"]과 같은 것입니다.

.match에

a.thislink:not(.ignore)[href^=http://]

하고 선택기의 배열로 그것을 밖으로 분할, 이상적 :

[a, .thislink, :not(.ignore), [href^=http://]] 내가 CSS3 선택기, 예와 같은 형식의 문자열 선택을 전달 찾고 있어요

내가 루프 할 수 있습니다. 그런 다음 동일한 not break()를 사용하여 not() 셀렉터를 사용하여 "not"의 두 번째 배열을 얻습니다.이 배열은 원래 선택기의 원래 배열과 비교할 수 있습니다.

태그, 클래스, ID, attr 및 : 선택자가 모두 필요합니다. 내 생각에 [attr=val]과 :not(selectorshere)을 무너 뜨리는 방법을 알아낼 수 있습니다.

PS : 나는 그러나, 나는 실제로이 선택기의 배열이없는 문자열 선택에 내 원래의 배열 값을 맞추기 쉬운 것 알고있다. 왜 이런 방식으로 정확하게하고 있는지 설명하는 데 몇 개의 단락이 필요합니다. 따라서 신뢰할 수 없습니다. 나는 할 수 없습니다.)

Answer 1

충분한 정규 표현식을 찾지 못할 경우를 대비해 PEG.js *과 같은 JavaScript 파서 생성기를 제안하십시오. online version의 PEG.js를 사용하면 문법을 고치고 결과에 만족하면 파서를 다운로드 할 수 있습니다.

[*] PEG는 - Parsing Expression Grammar

문법에 대한 도움말 당신은 W3C's working draft on CSS3 syntax W3C's recommendation on Selectors Level 3와 상담해야합니다.

나는 하나의 선택자 (element/id/attr/class/pseudo)에 대해 줄여 준 문법을 생각해 냈다. 아마 여기저기서 다듬고 싶을 것입니다.

/* 
* PEG.js grammar 
*/ 
start  = element? hash? (class/attr/pseudo)* 
element = '*'/ident 

ident  = i:(nmstart) j:(nmchar*) {return i + j.join('');} 
hash  = h:('#' ident) {return h.join('');} 
class  = c:('.' ident) {return c.join('');} 
attr  = a:('[' (b:[^\]]+ {return b.join('');}) ']') {return a.join('');} 
pseudo  = p:(':' function) {return p.join('');} 

nmstart = [a-z]/nonascii 
nmchar  = [a-z0-9-]/nonascii 
function = f:(ident '(' body ')') {return f.join('');} 
body  = b:[^\)]+ {return b.join('');} 

nonascii = [\x80-\xff] 
_   = [ \t\n\r]+ {return '';}