jQuery에서 XPath를 선택 가능한 CSS3 형식으로 변환하려면 JavaScript 또는 jQuery 라이브러리가 필요합니다.

StackOverflow https://stackoverflow.com/questions/1652759

  •  22-07-2019
  •  | 
  •  

문제

XPath를 어떻게 변환 할 수 있습니까?

/html/body/div[3]/ul/li[1]/a[5]

html > body > div[3] > ul > li[1] > a[5]

INDEX는 CSS3 선택기와 함께 지원되지 않는다고 생각합니다.

도움이 되었습니까?

해결책

지글 지글/jQuery가 CSS3 선택기를 적용 할 수 없다는 것을 알게되면 xpath 플러그인 이것은 jQuery의 원래 릴리스의 일부였습니다 (그리고 실제로 사용한 사람이 거의 없기 때문에 제거되었습니다).

브라우저의 XPath 구현은 많은 경향이 있습니다 더 빠르게 CSS 엔진보다. 또한 js parse 및 xpath 표현식을 CSS3로 변환 한 다음 브라우저가 구현할 수있는 jQuery munge를 갖는 것 (일반적으로 CSS2.1 선택기가 약간의 JS 지원을받을 수 있습니다). 많이 브라우저에서 직접 XPath를 실행하는 것보다 느립니다.

뿐만 아니라 Xpath가 CSS가 할 수없는 일이 있습니다. 예를 들어:
//h3[class="blog-title"]/../../div[class="blog-entry"]//input[fn:floor(value) > 3]
XPath가 실행하기에 지나치게 복잡하지는 않지만 CSS만으로는 불가능합니다. DOM을 뒤로 이동시키고 표현식의 일부로 기능을 실행하는 것은 CSS3에서도 아직 수행 할 수 없습니다.

다른 팁

Selenium 1 's CSS 로케이터 엔진은 CSSQuery에서 jQuery의 CSS 선택기 라이브러리 인 Sizzle로 이동했습니다. 그래서 당신은 변환 할 수 있습니다

div[3]/ul/li[1]/a[5] 

에게

css=div:nth(3)>ul>li:nth(1)>a:nth(5)

그리고

//h3[class="blog-title"]/../../div[class="blog-entry"]//input[@value=3] 

변환 할 수 있습니다

css=h3.blog-title:parent(div.blog-entry) input[value=3]

하지만 //input[@value>3] 더 많은 정보를 위해 가능하거나 까다로울 수 없습니다. https://github.com/jquery/sizzle/wiki/sizzle-home

IE의 XPath 구현은 매우 느립니다. IE6에서 끔찍한 느리게도 대부분의 사람들이 Regex 등을 기반으로 CSS 선택기를 사용하는 경향이 있습니다. Sizzle 또는 최신은 Qwery입니다. 인덱스 선택의 경우 선택기 CSS에서 사용하십시오. :nth-child(n)

a[5] = :nth-child(5)

0 또는 1으로 시작하는지 기억할 수 없으므로 4 일 수도 있습니다.

또한 선택하는 부모 내에 다른 유형의 자녀가있는 경우 사용할 수 있습니다. :nth-of-type() 주어진 유형 만 선택합니다. 귀하의 경우 :

a:nth-of-type(5)

꽤 많이 검색하고 마침내이 2 개의 라이브러리를 찾았습니다. 나처럼 잃어버린 사람을 도울 수 있기를 바랍니다.

  1. 제임스 패드시 CSS2XPATH 그것은 어느 시점에서 YQL HTML에 의해 사용되었습니다.
  2. CSS2XPATH - XPath 변압기에서 일반 CSS

이것은 상당히 틈새 영역이기 때문에 커뮤니티가 편집 할 수 있도록 환영합니다.

라이센스 : CC-BY-SA ~와 함께 속성
제휴하지 않습니다 StackOverflow
scroll top