본문으로 건너뛰기

XPath 테스터

XPath Tester

XML·HTML에 XPath나 CSS 선택자를 적용해 일치하는 노드를 모두 보여 줍니다.

XPath 1.0 식이나 CSS 선택자를 XML·HTML 문서에 실행해서, 일치한 노드를 각자의 절대 경로와 함께 보여 줍니다. 평가는 브라우저 자신이 하므로, 여기서 보는 결과가 코드에서 `document.evaluate`가 낼 결과입니다.

🔒 브라우저 안에서만 처리xpathxmlselectortest

XPath 1.0 식

질의 언어

문서

읽는 방식

파일 놓기

이 탭 안에서만 읽습니다.

결과

입력하는 대로 결과가 여기 나타납니다.

어떻게 실행되는지

  • · 평가는 브라우저의 document.evaluate(XPath 1.0)와 querySelectorAll이 합니다. 결과 종류 — 노드 집합·숫자·문자열·불리언 — 와 각 노드의 절대 경로, 네임스페이스 접두사 처리는 이 도구가 붙입니다.
  • · XML 모드는 규격대로 엄격하게 읽어 잘못된 곳을 알려 주고, HTML 모드는 브라우저처럼 관대하게 읽습니다. HTML에서는 태그 이름이 소문자로 정규화되므로 //DIV 보다 //div 가 맞습니다.
  • · 기본 네임스페이스(xmlns="…")가 선언된 문서에서는 접두사 없는 이름이 매치되지 않는 것이 XPath 1.0의 규칙입니다. 그럴 때는 _ 접두사를 써서 //_:item처럼 씁니다.
  • · XPath 2.0/3.x 함수(matches, ends-with, lower-case)는 브라우저에 없습니다. contains·starts-with·translate·normalize-space 가 1.0의 도구입니다.
  • · 문서는 이 탭 안에서만 읽고, 어디에도 올라가지 않습니다.

JSON이라면 JSONPath 테스터 나 jq 실습장이 맞는 도구입니다.

사용 방법

  1. 문서를 어떻게 읽을지 고릅니다

    XML 모드는 엄격하게 읽고 잘못된 곳을 알려 줍니다. HTML 모드는 브라우저처럼 관대하게 읽고 태그 이름을 소문자로 정규화합니다.

  2. 식을 씁니다

    XPath나 CSS 선택자 중에 고릅니다. 예시 버튼이 속성, 술어, 네임스페이스, 주석 노드, 값 하나를 돌려주는 함수까지 담고 있습니다.

  3. 결과 종류를 먼저 봅니다

    XPath의 결과는 네 종류이고 그중 하나만 노드 집합입니다. `count()`, `string()`, `boolean()`은 값 하나를 돌려주고, 빈 목록이 아니라 그 값 자체로 보여 줍니다.

자주 묻는 질문

문서는 멀쩡한데 식이 아무것도 못 찾습니다.

거의 확실히 기본 네임스페이스 때문입니다. 루트에 `xmlns="…"`가 있으면 XPath 1.0에서 접두사 없는 이름은 아무것도 매치하지 않습니다. 접두사를 묶어야 합니다. 여기서는 그 접두사가 `_`라서 `//item`을 `//_:item`으로 씁니다.

`matches()`는 왜 없나요?

브라우저가 XPath 1.0만 구현하기 때문입니다. `matches`, `ends-with`, `lower-case` 같은 것은 2.0에서 들어왔고 어느 브라우저에도 없습니다. 1.0에서 쓸 수 있는 것은 `contains`, `starts-with`, `translate`, `normalize-space`입니다.

XPath와 CSS 중에 뭘 써야 하나요?

CSS가 짧고 대부분의 스크래핑에는 충분합니다. XPath는 위로 올라갈 수 있고(`..`, `ancestor::`), 텍스트 내용으로 매치할 수 있고, 숫자와 문자열을 돌려줄 수 있습니다. 선택자로는 못 하는 것들이죠. 이 페이지는 둘 다 돌려서 같은 문서에서 비교할 수 있게 합니다.

페이지를 대신 가져와 주나요?

아니요. 문서를 붙여넣거나 놓으면 이 탭에서 읽습니다. 가져오려면 프록시가 필요한데 — 브라우저는 페이지가 다른 출처를 읽게 두지 않습니다 — 그 프록시는 여러분이 시험한 것을 전부 보게 됩니다.

이 도구로 이어지는 것

다음 단계

이 도구의 결과를 그대로 받을 수 있는 도구들입니다.